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信息 可 倪 化 交互 设计 ( 诛 书 第 ?版 ) 


Information Visualization Desien for Interaction second Edition 


信息 可 视 化 是 计算 机 科学 的 新 兴 分 支 之 一 ， 主 要 利用 图 形 图 像 技 术 对 大 规模 数据 进行 可 视 化 表示 ， 以 增 
强 用 户 对 数据 更 深层 次 的 认 知 

本 书 是 英国 著名 信息 可 视 化 专家 Robert Spence 教 授 的 代表 作 ， 也 是 世界 3 范围 内 信息 可 视 化 领域 最 为 经 典 
的 教材 之 一 。 该 书 结构 清晰 ， 内 容 丰 富 ， 案 例 翔 实 ， 系 统 地 介绍 了 信息 可 视 化 的 概念 、 技 术 和 应 用 。 通 过 本 
书 的 学 习 ， 读 者 可 以 了 解 信息 可 视 化 的 基本 概念 和 知识 ， 同 时 培养 可 视 化 和 交互 设计 的 基本 技能 


本 书 特色 
@ 结构 清晰 ， 内 容 丰 富 ， 详 细 介 绍 了 该 领域 的 主要 概念 及 其 重要 性 ， 并 重点 突出 了 数据 描述 、 数 据 表 示 和 
交互 这 三 个 主要 概念 
@ 为 读者 提供 大 量 的 实例 和 案例 分 析 ， 和 生动、 形象 地 展示 信息 可 视 化 的 不 同 应 用 
@ 配套 的 PPT ( 英文 原版 ) 可 从 华章 网 站 ( www.hzbook.com ) 下 载 


民 汪 DVD 中 包含 大 量 视频 剪辑 


作者 简介 

Robert Spence 伦敦 帝国 理工 学 院 信息 工程 专业 名 誉 退休 教授 ， 教 授 电子 工程 和 人 机 交 s 
互 方面 的 课程 。 他 目前 的 研究 兴趣 主要 集中 在 “快速 系列 视觉 表示 ”这 一 新 颖 技术 。 他 是 信息 Y 
可 视 化 领域 的 先驱 研究 者 之 一 ， 提 出 了 许多 经 典 概念 
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本 书 系统 地 介绍 了 信息 可 视 化 的 概念 、 基 本 技术 和 应 用 ， 主 要 内 容 包 括 : 信息 可 视 化 概念 
及 案例 、 信 息 感知 及 信息 表示 、 交 互 式 设计 、 多 维 信息 可 视 化 、 图 形 可 视 化 、 案 例 分 析 。 通 
过 本 书 的 学 习 ， 读 者 可 以 了 解 信息 可 视 化 的 基本 概念 和 知识 ， 同 时 培养 可 视 化 和 交互 式 设计 
的 能 力 。 

本 书 可 以 作为 计算 机 科学 及 相关 专业 本 科 生 或 研究 生 教 材 ， 也 可 以 作为 相关 领域 研究 人 员 
和 专业 技术 人 员 的 参考 书 。 
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信息 可 视 化 
彩 图 1-6 信息 可 视 化 过 程 。 通 过 观察 数据 的 图 形 编码 来 为 其 构建 心理 模型 
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a) 用 于 新 药 研究 的 表格 。 该 表 粘 中 有 多 行 代表 化 合 物 的 数据 。 每 种 化 合 物 拥有 14 项 属性 。 
从 该 表格 中 获取 信息 启示 是 很 困难 的 
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b) 对 表格 数据 的 视觉 编码 可 以 增强 理解 。 在 本 例 中 ， 图 表 的 坐标 分 别 为 属性 “IJD” 和 
“Assay 荆 。 颜 色 和 形状 均 表示 是 否 通过 了 某 种 提纯 测试 ， 大 小 表示 分 子 重量 。 某 种 化 合 
物 经 过 识别 后 ， 其 分 子 结构 将 显示 在 左边 (图片 感谢 Spotfire 公 司 惠 允 ) 


彩 图 1-7 用 于 新 药 研 究 的 表格 及 对 表格 数据 的 视觉 编码 








彩 图 1-12 X 光 扫描 图 像 重建 图 。 用 不 同 的 颜色 显示 美国 得 克 萨 斯 州 有 角 蜥 蝎 和 墨西哥 有 角 蜥 蝎 的 
外 皮 和 骨骼 之 间 的 距离 (图 片 感谢 Wendy Hodges 博 士 、Timothy Rowe 博 士 以 及 
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彩 图 1-13 1881 年 和 1998 年 英国 人 口中 Spence 姓 氏 的 地 理 分 布 
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彩 图 2-5 通过 图 片 选 定 一 辆 汽车 ， 它 的 价格 通过 图 片 和 条 形 图 上 对 应 图 标的 颜色 编码 得 以 体现 
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彩 图 2-6 对 应 图 标的 颜色 编码 显示 了 选中 汽车 在 各 个 条 形 图 中 的 位 置 
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彩 图 2.7 条 形 图 上 的 图 标 可 以 表示 一 辆 理想 (但 彩 图 2-8 可 以 对 列 人 考虑 范围 的 汽车 加 以 “标注 ”， 
可 能 不 存在 ) 的 汽车 。 该 图 标 可 作为 参 以 供 进一步 考察 
brit 
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彩 图 2-9 对 条 形 图 范围 的 动态 选择 (本 例 中 设 价格 范围 为 12 一 14 万 ) 显示 有 4 辆 符合 条 件 的 汽车 
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彩 图 2-10 交互 式 地 选择 了 MPG 范 围 后 ， 只 有 同时 满足 价格 和 MPG 条 件 的 汽车 才 会 得 到 高 显 
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彩 图 2-11 当 没 有 足够 的 空间 显示 所 有 的 条 形 图 时 ， 可 以 在 视窗 中 滚动 查看 这 些 属性 
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彩 图 2-12 当 没 有 足够 的 空间 显示 所 有 的 条 形 图 时 ， 可 以 通过 压缩 非 焦点 条 形 图 高 度 的 方法 来 一 
次 性 地 显示 更 多 的 条 形 图 。 通 过 滚动 功能 来 决定 当前 完全 展开 的 条 形 图 
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彩 图 2-13 如 果 用 户 只 对 某 一 价格 范围 内 的 汽车 感 兴趣 ， 可 以 压缩 掉 其 他 不 相关 的 数据 








彩 图 3-1 第 2 章 中 讨论 的 汽车 购买 系统 的 彩 图 3-9 现代 飞行 高 度 计 
部 分 界面 : 紫色 代表 某 种 关系 





彩 图 3-19 10 年 来 洛杉矶 上 空 的 臭氧 浓度 


彩 图 3-10 手术 过 程 中 对 病人 重要 生理 信号 的 描述 。 
在 长 时 间 手 术 过 程 中 对 大 量 数据 进行 监测 
的 困难 性 导致 声学 编码 的 引入 : 用 一 组 重 
复 的 “ 嘟 哪 ” 声 表示 信号 的 变化 。 无 论 麻 
醉 师 是 否 注 视 显 示 屏 幕 ， 都 能 通过 声音 立 
即 意识 到 信和 号 的 变化 (图片 感谢 Marcus 
Watson i ft ) 
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彩 图 3-27 对 图 3-26 中 的 数据 做 投影 以 方 彩 图 3-29 当前 空间 内 的 售 点 住房 可 以 通过 扫 


便 对 价格 和 房间 数 进 行 比较 光 在 其 他 空间 内 得 到 高 显 





@@OneeOOOHOO 
2@eeeeoenreooded @ 
eeoeeoneooeonoeor 
Omeoonmnoeonoon 
®@COmuneooeoeeen 
BOB BOBOEROO 
BOBHEEEEOE B 
颜色 
彩 图 3-36 不 同 的 颜色 可 以 被 下 意识 处 理 彩 图 3-37 联合 编码 导致 红色 方块 不 能 被 下 意识 处 理 
使 用 负载 | 增长 方向 
强制 通话 
结束 率 





强度 
彩 图 3-38 移动 电话 网 络 性 能 描述 






上 午 11:30 至 
下 午 12:30 


彩 图 3-39 移动 电话 网 络 一 个 小 时 内 (11:30~ 12:30) 的 平均 性 能 描述 
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彩 图 3-41 对 四 类 常规 任务 的 Bertin 编 码 原则 


制药 业 的 最 新 研究 成 果 






Fortunately, scientific knowledge about this desease has grown, and there is reason for hope. 


(Research is revealing hadi may be achieved through estrogen replacement therapy 


for older women and through adequate calcium intake and regular weight-bearing exercise 
for people of all ages. New approaches to diagnosis and treatment are also under active 
investigation. For this work to continue and for use to take advantage of the knowledge we 
have already gained. public awareness of 上 生生 请 and of the importance of further 


scientific Posenieh is essential 
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彩 图 3-43 (上 图 ) 平 铺 条 形 图 显示 了 
的 相关 性 ; (下 图 ) 在 被 选 


题词 得 到 高 显 
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彩 图 3-42 -个 感 兴趣 的 主题 词 
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彩 图 3-44 Cleveland 和 McGill 建 立 的 编码 评估 机 
制 显 示 了 对 数值 型 数据 编码 方式 精确 
度 进行 判断 的 难度 





彩 图 3-45 Mackinlay 对 数值 型 、 顺 序 型 和 类 别 型 数据 的 编码 指导 
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彩 图 3-53 通过 额外 的 选择 技术 来 增强 散 点 图 的 功用 ， 人 允许 用 户 对 如 片 型 、 时 长 、 制作 年 代 等 电 
影 属 性 进行 选择 
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彩 图 3-54 当 用 户 选 择 了 特定 的 制作 年 代 和 时 长 范围 后 ， 系 统 自动 显示 符合 条 件 的 电影 的 细节 
言 息 





彩 图 3-55 一 组 住房 的 价格 直方 图 。 图 中 的 黄色 小 彩 图 3-56 设置 价格 属性 范围 ， 符 合 条 件 的 住房 得 
方块 表示 其 中 一 栋 住房 到 绿色 高 显 





彩 图 3-57 价格 范围 和 图 3-53 相 同 ， 符 合 该 条 件 的 住房 在 其 余 两 个 直方 图 中 同样 得 到 高 显 
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彩 图 3-58 只 有 满足 所 有 条 件 的 住房 才 得 到 高 显 。 仅 不 满足 其 中 一 项 条 件 的 住房 显示 为 黑色 ， 因 
此 如 果 放 宽 对 应 的 限制 条 件 ， 这 些 黑 色 的 住房 就 能 变 为 绿色 





彩 图 3-59 即使 没有 满足 所 有 条 件 的 住房 ， 唯 一 不 满足 一 个 条 件 的 黑色 住房 也 为 放松 限制 提供 了 
指导 方向 
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彩 图 3-60 属性 浏览 器 显示 了 一 场 灾难 救援 演习 中 收集 到 的 : 维 通信 数据 ， 它 支持 分 析 者 的 交互 
式 探索 
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彩 图 3-61 泰坦 尼克 号 事件 的 镶嵌 图 的 生成 过 程 





彩 图 3-66 支持 对 象 可 见 性 的 多 属性 数据 描述 方法 
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彩 图 3-67 支持 属性 可 见 性 的 多 属性 数据 描述 
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彩 图 3-71 用 颜色 表示 关系 
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Years AD 
彩 图 3-72 公元 550 年 一 700 年 间 在 英格兰 Anglo-Saxon 地 区 发 生 的 战事 。 红 色 表 示 侵 略 者 ， 绿 色 表 
示 被 侵略 者 。 图 片 来 源 : After Arnold (1997) 
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a) 抵押 贷款 活动 的 描述 。 借 贷方 、 房 屋 属性 、 购 买 者 等 多 个 b) 申请 人 表示 为 图 3-74a 所 示 的 贷款 活动 描述 中 的 放 
角色 被 描述 为 环 面 上 的 一 个 片段 ( 见 图 3-74b) 。 它 们 之 间 AREE 








的 关系 用 线段 标明 
彩 图 3-74 对 抵押 贷款 活动 的 描述 
注意 模式 是 如 何 产生 的 ， 其 中 涉及 
* 、+、# 和 ! 等 符号 
地 产 — 
中 介 人 SN 
本 SS 
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彩 图 3-75 CE PRL3~74 Fira A aii P An E a {LR ATE H Ap SAT AE. AE MOT ty 
通过 连接 的 线段 得 到 凸显 
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彩 图 3-78 Harry Beck 的 伦敦 地 铁 原始 图 (图 片 来 源 : Transport for London) 
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彩 图 3-79 出 现 于 Harry Beck 版 之 前 的 伦敦 地 铁 地 图 (图 片 来 源 ，Transport for London) 





a) 部 门 雇员 的 社会 选择 。( 图 片 来 源 : 感谢 L. C b) 部 门 雇员 的 社会 选择 ， 颜 色 编 码 表示 婚姻 状态 ， 
Freeman 4 ft ) (图 片 来 源 : RHL. C. Freeman a f) 





c) 部 门 雇员 的 社会 选择 ， 颜 色 编 码 表示 不 同 的 年 龄 段 ( 蓝 色 <30，30< 
黄色 <40， 红 色 >40)。( 图 片 来 源 : 感谢 L. C. Freemani fè) 


彩 图 3-81 部 门 雇员 的 社会 选择 


房间 数 花园 面积 





彩 图 3-84 从 一 个 包含 三 个 属性 的 维 思 图 到 信息 水 晶 图 的 转换 过 程 。 图 中 所 示 的 信息 水 晶 图 允许 
关于 价格 、 花 园 面 积 和 房间 数 的 视觉 查询 ( 见 图 3-58 显 示 的 属性 浏览 器 )。 星 号 表示 满 
足 价格 和 花园 面积 要 求 但 不 满足 房间 数 条 件 的 住房 
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彩 图 3-86 和 图 3-83 所 示 的 维 思 图 以 及 图 3-85 所 。 彩 图 3-87 显示 有 4 个 属性 的 24 家 酒店 的 族群 图 (图片 
示 的 信息 水 唱 图 内 容 一 致 的 族群 图 感谢 Christiaan Fluit, Aduna 3i fè ) 
(图 片 感谢 Christiaan Fluit, Aduna% fe ) 
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彩 图 3-93 对 一 位 作家 的 作品 集 的 树 图 描述 (图 片 感谢 Ben Shneiderman dK ft ) 
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F 对 属性 进行 过 滤 (图 片 经 HIVE 惠 区 ) 





a) b) 


彩 图 3-99 可 供 交互 设计 师 选用 的 “ 调 色 板 " : a) 技术 ; b) 概念 
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彩 图 4-5 去 往 Halifax 方 向 的 旅途 中 途经 的 小 彩 图 4-6 一 个 真实 或 虚拟 的 放大 镜 遮 住 了 放 
镇 Huddersfield 的 详细 信息 大 区 域 周围 的 细节 信息 


ee mm 图 -去 -| 


a) 一 个 由 文件 、 邮 件 组 成 的 信息 空间 





视角 方向 





b) 空间 的 左右 两 端 被 折 膨 


c) 从 一 个 正确 的 视角 看 到 的 信息 空间 





彩 图 4-7 DragMag 技 术 允 许 对 任意 区 域 的 放大 彩 图 4-8 双 焦 显示 的 主要 原理 示意 图 





彩 图 4-9 早期 双 焦 显示 实例 


彩 图 4-10 某 种 蛋白 质 的 氨基 酸 序列 (图 片 感谢 Tom Oldfield 惠 允 ) 
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彩 图 4-11 表格 透镜 。a) 没有 变形 ，b) 通过 变形 (展开 ) 显示 姓名 





彩 图 4-30 在 某 数 量 级 上 (ID=10mh) 用 不 同 颜 色 标注 蛋白 质 转 移 酶 分 子 表面 的 潜在 DNA 静 电 跃 
进 。 魔 术 透 镜 窗口 中 显示 了 相关 原子 结构 ， 跃 进 的 配合 基 结 构 高 显 为 圆柱 状 ， 从 而 提 
供 了 和 蛋白质 的 内 部 视图 
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彩 图 4-38 快速 序列 视觉 表示 (Rapid Serial Visual 彩 图 4-39 图 片 集 的 同时 表示 
Presentation, RSVP)。 每 次 显示 图 片 集中 
的 一 幅 图 片 ， 图 片 之 间 以 一 定 的 速度 
(如 1 秒 钟 显示 10 幅 图 片 ) 进行 切换 





喜爱 的 模式 最 不 喜欢 的 模式 
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彩 图 4-49 3/4 的 参与 者 喜欢 (静态 ) 幻灯 片 、 混 合 ” 彩 图 4-50 几乎 所 有 受 欢 迎 的 模式 都 属于 运动 模式 ， 
和 堆 模式 超过 一 半 的 参与 者 不 喜欢 流 模式 





d) e) 


彩 图 4-51 对 图 片 集 的 六 种 表示 模式 的 代表 性 眼球 活动 轨迹 的 数据 记录 : a) 幻灯 片 模式 ，b) Hi 
模式 ，c) 混合 模式 ，d) 对 角 线 模式 (不 喜欢 该 模式 的 用 户 ) ，e) 对 角 线 模式 (喜欢 
该 模式 的 用 户 ) ; f) 流 模式 (不 喜欢 该 模式 的 用 户 ) 
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彩 图 4-58 习题 4.6 的 一 种 可 能 的 解决 办 法 (见习 题 4.9) 





信息 空间 交互 模式 
彩 图 5-7 信息 空间 、 交 互 模式 以 及 两 者 的 结合 示例 





彩 图 5-21 黑色 编码 表示 仅 不 满足 1 个 属性 限制 的 住房 ， 它 提供 了 人 敏感 度 信息 
位 置 结 构 





彩 图 5-40 位 置 历史 信息 (红色 ) 提供 了 结构 信息 ， 同 时 也 显示 了 用 户 当前 位 置 


iii 第 2 个 区 域 焦点 





第 3 个 区 域 焦点 
彩 图 5-43 对 认 知 心理 学 感 兴趣 的 用 户 对 书架 的 视觉 浏览 示意 图 。 第 1 个 区 域 焦点 集中 在 红色 部 分 ， 
通过 对 所 有 书籍 的 探 罕 发现 心理 学 的 书籍 大 多 集中 在 绿色 区 域 (第 2 个 区 域 焦点 )。 对 
该 区 域 的 研究 发 现 认 知心 理学 集中 在 蓝 色 区 域 (第 3 个 区 域 焦点 ) 


预计 性 能 和 实际 性 能 
之 间 的 差异 
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彩 图 5-45 允许 用 户 指导 的 电路 自动 设计 系统 草图 。 时 钟 指 针 的 移动 代表 优化 算法 的 迭代 行为 。 
蓝 色 条 状 和 红色 圆圈 的 大 小 分 别 表示 算法 选择 的 参数 值 和 电路 的 各 种 性 能 指标 。 设 计 
师 可 以 在 任意 时 刻 暂 停 算 法 的 运行 、 改 变 算法 细节 或 设置 算法 性 能 的 某 些 限定 条 件 
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彩 图 $-48 将 某 结构 的 随机 生成 的 设计 方案 中 的 四 种 压力 显示 在 直方 图 中 
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形 图 5-49 根 




















形 图 5-50 有 四 个 参数 的 设计 训 析 矩阵。 红色 表示 满足 所 有 彩 图 5-53 可 以 通过 动画 表示 的 图 c) 来 描 


条 绘 视图 aj 和 b) 之 间 的 转化 





性 能 限制 条 件 的 设计 ， 黄 色 表 示 放 宽 参 数 | 


件 后 大 规模 生产 所 对 应 的 设计 
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彩 图 6-10 每 个 任务 的 完成 率 ( 蓝 色 =FishCal， 红 彩 图 6-13 EZChooser 界 面 截图 


色 =Pocket PC) 
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彩 图 6-29 属性 浏览 器 在 通信 系统 中 的 应 用 示意 图 

















彩 图 6-30 支持 通信 行为 分 析 的 MIND 系 统 界面 
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彩 图 6-31 文件 库 的 风景 编码 





彩 图 6-32 关于 金融 行业 的 700 篇 文章 的 主题 编码 彩 图 6-40 符合 查询 条 件 的 区 域 和 文档 都 得 到 高 显 
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文艺 复兴 以 降 ， 源 远 流 长 的 科学 精神 和 逐步 形成 的 学 术 规范 ， 使 西方 国家 在 自然 科学 的 各 个 领域 取得 
了 鸡 断 性 的 优势 ， 也 正 是 这 样 的 传统 ， 使 美国 在 信息 技术 发 展 的 六 十 多 年 间 名 家 摹 出 、 独 领 风 又 。 在 商业 
化 的 进程 中 ， 美 国 的 产业 界 与 教育 界 越 来 越 紧密 地 结合 ， 计 算 机 学 科 中 的 许多 泰山 北斗 同时 身 处 科研 和 教 
学 的 最 前 线 ， 由 此 而 产生 的 经 典 科学 著作 ， 不 仅 壁 划 了 研究 的 范畴 ， 还 揭示 了 学 术 的 源 变 ， 既 遵循 学 术 规 
范 ， 又 自 有 学 者 个 性 ， 其 价值 并 不 会 因 年 月 的 流逝 而 减退 。 

近年 ， 在 全 球 信息 化 大 潮 的 推动 下 ,我 国 的 计算 机 产业 发 展 迅猛 ， 对 专业 人 才 的 需求 日 益 迫 切 。 这 
对 计算 机 教育 界 和 出 版 界 都 轻 是 机 遇 ， 也 是 挑战 ， 而 专业 教材 的 建设 在 教育 战略 上 显得 举足轻重 。 在 我 
国信 息 技术 发 展 时 间 较 短 的 现状 下 ， 美 国 等 发 达 国 家 在 其 计算 机 科学 发 展 的 几 十 年 间 积淀 和 发 展 的 经 典 
教材 仍 有 许多 值得 借鉴 之 处 。 因 此 ， 引 进 一 批 国外 优秀 计算 机 教材 将 对 我 国 计 算 机 教育 事业 的 发 展 起 到 
积极 的 推动 作用 ， 也 是 与 世界 接轨 、 建 设 真正 的 世界 一 流 大 学 的 必由之路 。 

机 械 工业 出 版 社 华章 公司 较 早 意识 到 “出 版 要 为 教育 服务 ”。 自 1998 年 开始 ， 我 们 就 将 工作 重点 放 在 
了 六 选 、 移 译 国外 优秀 教材 上 。 经 过 多 年 的 不 懈 努 力 ， 我 们 与 Pearson, McGraw-Hill,，Elsevier, MIT， 
John Wiley & Sons，Cengage 等 世界 著名 出 版 公司 建立 了 良好 的 合作 关系 ， 从 他 们 现 有 的 数 百 种 教材 中 于 
选 出 Andrew S. Tanenbaum, Bjarne Stroustrup, Brain W. Kernighan, Dennis Ritchie, Jim Gray, Afred V. 
Aho, John E. Hopcroft, Jeffrey D. Ullman, Abraham Silberschatz, William Stallings, Donald E. Knuth, 
John L. Hennessy, Larry L. Peterson 等 大 师 名 家 的 一 批 经 典 作 品 ， 以 “计算 机 科学 丛书 ”为 总 称 出 版 ， 供 
读者 学 习 、 研 究 及 珍藏 。 大 理 石 纹 理 的 封面 ， 也 正体 现 了 这 套 丛 书 的 品位 和 格调 。 

“计算 机 科学 丛书 ”的 出 版 工作 得 到 了 国内 外 学 者 的 鼎力 衷 助 ， 国 内 的 专家 不 仅 提供 了 中 肯 的 选 题 指 
导 ， 还 不 辞 劳苦 地 担任 了 翻译 和 审 校 的 工作 ， 而 原 书 的 作者 也 相当 关注 其 作品 在 中 国 的 传播 ， 有 的 还 专 
程 为 其 书 的 中 译本 作 序 。 迄 今 , “计算 机 科学 丛书 ”已 经 出 版 了 近 两 百 个 品种 ， 这 些 书 籍 在 读者 中 树立 了 
良好 的 口碑 ， 并 被 许多 高 校 采 用 为 正式 教材 和 参考 书籍 。 其 影印 版 “经 典 原版 书库 ”作为 姊妹 篇 也 被 越 
来 越 多 实施 双语 教学 的 学 校 所 采用 。 

权威 的 作者 、 经 典 的 教材 、 一 流 的 译 者 、 严 格 的 审 校 、 精 细 的 编辑 ， 这 些 因素 使 我 们 的 图 书 有 了 质量 
的 保证 。 随 着 计算 机 科学 与 技术 专业 学 科 建 设 的 不 断 完善 和 教材 改革 的 逐渐 深化 ， 教 育 界 对 国外 计算 机 教 
材 的 需求 和 应 用 都 将 步 和 一 个 新 的 阶段 ， 我 们 的 目标 是 尽善尽美 ， 而 反馈 的 意见 正 是 我 们 达到 这 一 终极 目 
标的 重要 帮助 。 华 章 公司 欢迎 老师 和 读者 对 我 们 的 工作 提出 建议 或 给 予 指正 ， 我 们 的 联系 方法 如 下 : 


华章 网 站 ;www.hzbook.com 

电子 邮件 : hzjsj@hzbook.com 

联系 电话 : (010) 88379604 = 

联系 地 址 ;北京 市 西城 区 百 万 庄 南 街 1 号 华章 教育 

邮政 编码 : 100037 华章 科技 图 书 出 版 中 心 
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信息 可 视 化 是 计算 机 科学 的 新 兴 分 支 之 一 。 近 年 来 ， 随 着 数据 的 爆炸 式 增长 ， 计 算 机 用 户 
面临 着 信息 过 载 的 严峻 考验 。 如 何 帮助 计算 机 用 户 更 快捷 有 效 地 从 大 量 数 据 中 提取 出 有 用 信息 
成 为 信息 可 视 化 的 核心 任务 。 信 息 可 视 化 主要 利用 图 形 图 像 技 术 对 大 规模 数据 进行 可 视 化 表示 ， 
以 增强 用 户 对 数据 更 深层 次 的 认 知 。 

本 书 是 英国 著名 信息 可 视 化 专家 Robert Spence 教 授 的 代表 作 ， 也 是 世界 范围 内 信息 可 视 化 
领域 最 为 经 典 的 教材 之 一 。 本 书 结构 清晰 ， 内 容 丰 富 ， 案 例 翔实 ， 系 统 地 介绍 了 信息 可 视 化 的 
概念 、 技 术 和 应 用 。 通 过 本 书 的 学 习 ， 读 者 可 以 了 解 信息 可 视 化 的 基本 概念 和 知识 ， 同 时 培养 
可 视 化 和 交互 设计 的 基本 技能 。 阅 读本 书 需要 了 解 计算 机 系统 的 基本 背景 知识 。 本 书 适用 于 计 
算 机 及 相关 专业 本 科 生 、 研 究 生 以 及 相关 领域 的 研究 人 员 和 专业 技术 人 员 。 

本 书 的 翻译 过 程 得 到 了 原 书 作者 Robert Spence 教 授 的 大 力 支 持 ， 他 不 仅 帮助 我 厘清 了 容易 
出 现 歧 义 的 内 容 ， 还 无 私 地 分 享 了 部 分 教学 幻灯 片 。 在 此 我 谨 向 Robert Spence# HLA RIS 
的 谢意 。 同 时 我 也 要 感谢 培 生 教育 出 版 集团 和 机 械 工业 出 版 社 各 位 编辑 的 热心 帮助 。 由 于 水 平 
所 限 ， 翻 译 难免 存在 不 妥 和 醇 漏 之 处 ， 敬 请 广大 读者 予以 批评 指正 。 


PAE SH 
2011 年 8 月 
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数据 无 处 不 在 : 组 织 管理 人 员 对 各 个 市 场 的 恒利 进行 分 析 以 决定 来 年 的 营销 策略 ， 父 母 为 
选 购 汽 车 而 查看 最 新 的 汽车 行业 标准 ;学 生 在 提交 人 学 申请 前 浏览 各 大 学 的 相关 数据 和 图 表 。 
人 们 生活 的 方方面面 都 充斥 着 数据 。 不 幸 的 是 ， 这 些 数 据 常 常 是 大 量 未 经 组 织 的 数字 和 文字 ， 
入 们 难以 理解 并 从 中 得 出 启示 。 

我 们 怎样 帮助 人 们 认识 并 理解 这 些 数据 呢 ? 通过 更 合理 的 组 织 、 创 建 数据 结构 以 及 提供 有 
意义 的 数据 描述 ， 我 们 可 以 将 数据 转化 为 人 们 更 容易 且 更 能 迅速 探索 的 形式 。 这 正 是 信息 可 视 
化 的 核心 任务 。 有 效 的 视觉 描述 可 以 帮助 人 们 浏览 并 理解 数据 中 包含 的 信息 。 正 如 Don 
Norman 和 Stuart Card 指 出 的 ， 可 视 化 对 人 们 的 记忆 和 思维 起 着 外 部 认 知 辅助 的 功能 。 包 括 本 
书 介绍 的 示例 在 内 的 信息 可 视 化 系统 结合 了 数据 的 说 明 性 描述 和 交互 式 用 户 界面 ， 使 得 人 们 可 
以 从 很 多 不 同 的 角度 对 数据 进行 探索 。 

信息 可 视 化 由 两 个 重要 部 分 构成 。 首 先是 实现 数据 描述 必需 的 支撑 性 技术 基础 。 数 学 、 计 
算 机 图 形 学 和 用 户 界面 技术 帮助 研发 者 创建 反应 迅速 的 、 清 蜥 的， 其 至 是 美观 的 可 视 化 工具 。 
信息 可 视 化 的 第 二 个 重要 组 成 部 分 是 人 类 用 户 。 如 果 对 信息 搜索 任务 和 信息 可 视 化 用 户 目标 没 
有 深刻 的 认识 ， 很 难 开发 出 实际 可 用 的 系统 。 要 想 开 发 出 有 效 的 信息 可 视 化 系统 ， 就 必须 对 人 
类 感知 和 认 知 能 力 有 着 深刻 的 理解 。 

在 大 量 反 映 概 念 和 理论 的 实例 帮助 下 ，Robert Spence 在 本 书 的 第 1 版 中 为 信息 可 视 化 提供 
了 一 个 易于 理解 的 简介 。Robert Spence 在 这 一 领域 长 期 优秀 的 表现 ， 如 对 焦点 + 上 下 文 技术 、 
高 交互 度 的 信息 显示 系统 Influence 和 属性 浏览 器 ， 以 及 融合 了 动画 模拟 的 RSVP 显 示 技 术 等 的 
研究 ， 使 他 成 为 撰写 信息 可 视 化 人 门 教材 的 最 佳人 选 。 

在 本 书 第 2 版 中 ，Robert Spence 对 第 1 版 的 内 容 做 了 全 新 的 重组 并 进行 了 大 量 的 文字 修改 ， 
重点 突出 了 数据 描述 、 数 据 表 示 和 交互 这 三 个 主要 概念 。 与 信息 可 视 化 系统 研发 者 为 新 应 用 领 
域 研 发 系统 时 所 做 的 一 样 ， 为 了 帮助 用 户 〈 即 本 书 读者 ) 更 好 地 理解 信息 可 视 化 的 主要 概念 ， 
Robert Spence 为 本 书 建 立 了 一 个 清晰 的 结构 。 本 书 思 路 清晰 ， 具 有 很 好 的 启发 性 ， 详 细 介绍 了 
该 领域 的 主要 概念 及 其 重要 性 。 

和 第 1 版 一 样 ， 第 2 版 引用 了 信息 可 视 化 及 其 系统 的 大 量 的 实例 和 案例 分 析 。 这 些 实例 包括 
Florence Nightingale 对 Crimean 医 院 的 描述 和 Harry Beck 的 伦敦 地 铁 地 图 等 经 典 的 信息 可 视 化 
图 形 , 以 及 使 用 了 精密 技术 的 现代 交互 式 计 算 机 图 形 界面 。 理解 信息 可 视 化 的 最 佳 方法 是 观察 ， 
Robert Spence 为 读者 提供 了 丰富 的 优秀 实例 ， 这 些 例子 也 启发 了 信息 可 视 化 的 未 来 发 展 方向 。 
此 外 ， 样 本 习题 、 教 学 课件 和 视频 等 在 线 资料 使 得 本 书 成 为 一 本 优秀 的 教科 书 。 


John Stasko 
佐治 亚 理 工学 院 


前 言 | 
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本 书 第 2 版 延续 了 第 1 版 间 在 为 广大 本 科 生 和 硕士 生 提供 导论 的 目标 ， 在 结构 和 内 容 上 相对 
于 第 1 版 做 了 很 大 变动 。 

。 结 构 

我 逐渐 意识 到 如 果 采 用 另 一 种 结构 ， 第 1 版 中 的 素材 会 给 学 生 和 其 他 读者 带 来 更 多 的 好 处 。 
因此 ( 见 下 面 的 示意 图 ) ， 在 惯 有 的 简介 性 章节 (第 1 章 ) 之 后 ， 我 在 第 2 章 中 用 了 整 章 的 篇 幅 ， 
通过 一 个 可 视 化 工具 的 详细 介绍 阐明 了 信息 可 视 化 (IV) 的 三 个 要 素 : 数据 描述 (数据 的 视 
觉 或 声 觉 编码 ) 、 数 据 表示 (对 已 编码 数据 的 选择 和 布局 ) 和 交互 (获取 不 同 的 数据 “视图 ”)。 
另外 ,我 认为 应 该 从 上 下 文 角度 来 看 待 信息 可 视 化 (感谢 应 用 需求 所 带 来 的 各 种 限制 条 件 ) ， 
因此 我 添加 了 一 章 包 含 多 个 案例 分 析 的 总 结 性 章节 (第 6 章 )。 我 希望 该 章 的 内 容 可 以 说 服 读者 ; 
和 其 他 设计 一 样 ， 信 息 可 视 化 的 应 用 在 很 大 程度 上 也 是 一 门 需 要 交互 设计 师 创造 力 的 技艺 。 

。 术 语 定义 和 参考 文献 

和 很 多 宣扬 信息 可 视 化 的 定义 不 同 ， 我 特别 强调 信息 可 视 化 和 用 户 对 数据 的 心理 模型 之 间 
的 关系 。 一 个 与 此 类 似 的 观点 认为 将 “视觉 ”和 “可 视 化 ”分 开会 在 很 大 程度 上 误导 读者 。 需 
要 注意 的 是 ， 虽 然 数 据 的 声 觉 编码 并 不 常见 ， 但 也 不 容 忽 视 。 本 书 提供 的 术语 表 反 映 了 我 长 期 
关心 的 一 个 问题 ; 虽然 很 多 人 和 希望 看 到 信息 可 视 化 相关 术语 的 清晰 定义 ， 但 是 很 多 术语 ， 如 
“浏览 "、“ 定 位 ”和 “查找 ”等 ， 都 没有 精确 的 定义 。 学 生 们 应 该 得 到 更 好 的 解释 。 如 果 读 者 
对 本 书 中 的 任何 定义 存 有 异议 ， 那 至 少 我 们 的 讨论 又 多 了 一 个 着 手 之 处 。 

关于 参考 文献 ， 很 多 在 20 世 纪 60 至 80 年 代 诞 生 的 信息 可 视 化 成 果 要 么 未 被 引用 ， 要 么 被 人 
遗忘 ， 在 本 书 中 我 努力 通过 引用 原始 参考 文献 的 方式 向 每 个 概念 或 技术 的 创始 人 致敬 。 考 虑 到 
本 书 并 不 是 一 本 科研 专著 ,因此 重要 的 参考 文献 应 该 能 帮助 有 兴趣 的 学 生 进行 更 深层 次 的 学 习 。 
他 们 可 以 参考 Card、Shneiderman 和 Mackinlay 所 著 的 《Information Visualization: Using Vision 
to Think》(2004 版 ) (信息 可 视 化 : 视觉 思考 ) 一 书 中 介绍 的 多 篇 优秀 论文 。 

。 人 类 行为 

第 2 版 和 第 1 版 的 另 一 个 不 同 之 处 在 于 对 人 类 认 知 行为 的 关注 。 当 注视 显示 数据 时 ， 用 户 经 
常会 有 一 系列 快速 的 眼球 运动 ， 他 们 对 所 见 进行 理解 ， 依 据 相 关 经 验 来 决定 对 数据 的 下 一 步 观 
察 。 所 有 这 些 行为 都 在 用 户 的 记忆 中 不 断 创建 和 修改 数据 的 心理 模型 ， 有 时 甚至 会 修改 需 解决 
的 问题 。 如 果 缺 乏 对 这 些 人 类 行为 哪怕 只 是 粗略 的 理解 ， 可 视 化 工具 的 设计 将 不 能 充分 和 用 人 
类 能 力 或 信息 可 视 化 潜力 。 然 而 ， 本 书 的 重点 在 于 信息 可 视 化 而 非 人 类 感知 和 认 知 ， 因 此 ， 本 
书 中 没有 专门 的 介绍 人 类 行为 的 章节 。 我 只 在 非常 重要 的 情况 下 以 及 不 影响 整体 结构 的 前 提 下 ， 
才 对 相关 入 类 行为 进行 了 介绍 ， 相 关 文 字 用 仿宋 体 标明 。 对 人 类 行为 感 兴趣 的 读者 可 以 参考 
Colin Ware 所 著 的 非常 优秀 的 《Information Visualization: Perception for Design》(2004 版 ) (信息 
可 视 化 : 设计 感知 ) 一 书 。 
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“读者 

关于 目标 读者 群 ， 虽 然 信息 可 视 化 已 被 证 明 有 着 很 广泛 的 应 用 范围 ， 但 是 第 1 版 还 是 主要 
针对 计算 机 科学 方向 的 大 学 课程 。 我 希望 除了 学 生 之 外 ， 不 仅 软件 工程 师 对 信息 可 视 化 的 了 解 
能 帮助 他 们 进行 更 好 的 软件 设计 ， 其 他 众多 的 专业 人 士 ， 如 警官 、 银 行家 、 经 理 、 在 线 经 销 商 
等 ， 也 能 从 信息 可 视 化 应 用 中 受益 。 我 们 并 不 期 望 他 们 成 为 IV 专 家 ， 但 是 希望 他 们 的 专业 知 
识 能 在 可 视 化 工具 的 使 用 和 评估 中 发 挥 积极 的 作用 。 

。 视觉 分 析 

我 最 近 碰 到 了 一 个 新 术语 “视觉 分 析 "。 一 开始 我 还 在 想 它 到 底 是 什么 ， 后 来 发 现 原来 在 
过 去 的 30 年 中 我 一 直 在 和 它 打交道 。 这 个 “新 ”术语 的 定义 “基于 交互 式 视觉 界面 的 分 析 推 理 
科学 ”显示 了 该 术语 和 本 书 的 密切 联系 。 另 外 ， 这 个 “新 ”领域 还 强调 认 知 科学 的 重要 性 ， 这 
和 我 们 前 面 提 到 的 本 书 中 介绍 认 知 科学 的 文字 不 谋 而 合 。 

。 教 学 资源 

第 一 次 教授 信息 可 视 化 课程 时 ， 我 为 了 组 织 各 种 图 片 和 图 表 耗 费 了 大 量 时 间 ， 对 此 我 仍 记 
忆 犹 新 。 因 此 ， 对 于 我 所 认识 的 超过 50 位 的 第 1 版 用 户 ， 我 和 他 们 分 享 了 我 的 幻灯 片 。 这 些 资 
料 在 出 版 商 的 网 站 上 可 以 免费 获得 。 随 书 发 行 的 DVD 里 有 很 多 我 认为 很 有 用 的 视频 剪辑 ， 它 
们 形象 地 展示 了 各 种 概念 和 技术 。 这 些 视频 都 比较 简短 (最 短 的 只 有 4 秒 ) ， 因 此 不 会 影响 正常 
的 教学 流程 。 附 录 中 有 对 各 个 视频 的 介绍 。 

。 教 学 方法 

我 相信 学 习 信息 可 视 化 的 最 佳 方法 是 动手 设计 。 因 此 ， 我 一 般 不 要 求学 生 上 交 考 试 论文 ， 
而 是 要 求 他 们 完成 各 种 不 同 难度 (从 简单 但 具有 挑战 性 的 到 非常 难 ) 的 设计 习题 。 我 还 要 求 他 
们 对 设计 进行 改进 ， 把 设计 结果 张贴 在 教室 墙 上 ， 这 样 有 助 于 教师 和 学 生 之 间 的 讨论 ， 从 而 增 
强 教学 效果 。 即 使 只 用 彩色 铅笔 和 纸 ， 学 生 们 也 能 从 本 书 中 的 设计 习题 中 学 到 很 多 东西 。 

我 要 特别 强调 第 6 章 中 的 习题 。 我 在 埃 因 霍 温 理工 大 学 和 其 他 一 些 地 方 都 将 其 作为 一 个 两 
周 的 教学 成 果 测试 。 学 生 们 分 成 4 人 小 组 , 要 求 他 们 在 4 天 内 完成 项 目 ， 有 些 组 选择 了 自 拟 题目 。 
除了 体现 设计 所 必需 的 编程 能 力 ， 这 些 练习 并 不 要 求学 生 们 有 高 超 的 编程 技巧 ， 我 们 检验 的 是 
和 信息 可 视 化 相关 的 创造 力 而 不 是 编程 能 力 。 第 二 天 后 每 组 做 一 个 20 分 钟 的 关于 该 组 最 新 进展 
的 中 期 报告 ， 并 回答 其 他 同学 和 教师 的 提问 。 为 了 模拟 实际 的 汇报 过 程 ， 我 要 求学 生 最 终 提交 
不 超过 4 页 的 ACM 会 议论 文 格式 的 报告 (不 允许 出 现 附录 或 图 片 )。 


Robert Spence 
2006 年 6 月 于 伦敦 
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如 果 没 有 同 很 多 人 或 多 或 少 的 交流 ,我 不 可 能 完成 这 本 书 的 写作 。 我 该 从 何 说 起 呢 ? 

我 想 首先 从 荷兰 埃 因 霍 温 理工 大 学 的 用 户 系统 交互 研究 生 课程 说 起 。 我 每 年 有 两 个 月 的 时 
间 会 在 此 教授 该 课程 的 信息 可 视 化 部 分 。 每 年 课程 内 容 的 更 新 以 及 活跃 的 课堂 讨论 对 本 书 的 大 
纲 和 主要 内 容 的 成 形 起 到 了 关键 性 作用 。 谢 谢 这 些 人 们 (你 们 知道 我 说 的 是 谁 ) | 除了 和 荷兰， 
我 也 在 伦敦 、 吉 隆 坡 、 新 加 坡 等 世界 各 地 授课 。 教 授 这 些 课程 也 需要 不 断 地 思考 ， 这 也 帮助 我 
完成 了 对 本 书 的 构想 。 

从 和 我 一 起 合作 的 研究 者 那里 我 学 到 了 很 多 : 早 在 1971 年 和 Mark Apperley 的 合作 ，20 世 
纪 90 年 代 初 和 Lisa Tweedie 的 合作 ， 以 及 20 世 纪 90 年 代 末 和 Oscar de Bruijn 的 合作 等 。 最 近 和 
Mark Witkowski, Catherine Fawcett 以 及 Katy Cooper 的 合作 对 我 的 研究 工作 和 本 书 的 写作 起 到 
了 非常 关键 的 作用 。 

很 多 人 在 各 种 场合 中 和 我 分 享 了 他 们 的 想法 : 比如 在 会 议 中 、 在 泰晤士 河 的 观光 船上 或 在 
一 家 非常 棒 的 希腊 餐厅 进餐 时 。 这 些 人 里 包括 交互 设计 师 Ron Bird， 三 菱 研究 实验 室 的 Kent 
Wittenburg ， 伦 敦 大 学 学 院 的 Brock Craft， 飞 行 员 Paul Hough, Herr Rudensteimer 和 Varnavas 
Serghides， 瑞 典 国 防 研 究 局 的 Par-Anders Albinsson 以 及 Bill Buxton。 很 多 人 非常 怀 慨 地 和 我 分 
享 了 他 们 的 建议 、 信 息 和 图 片 : 麻 省 理工 学 院 的 Mary Potter 博 士 (人 类 视觉 处 理 )、 斯 坦 福 大 
学 的 Barbara Tversky (记忆 )、Tom Oldfield (生物 信息 学 )、George Furnas (IRA). 
Andy Cockburn (缩放 和 平移 ) Carl Gutwin (变形 评估 ) Harri Siirtola (平行 坐标 图 )、 
Pourang Irani (移动 基站 )、Xerox PARC 的 Ed Chi 和 Peter Pirolli (气味 )、 交 互 设 计 师 Alison 
Black, Chris Ahlberg (Spotfire 公 司 的 CEO ) Gerard Conway (制药 业 )、Soon Tee Teoh (一 
致 性 和 相关 性 )、Lin Freeman (社交 网 络 )、Adena 的 Christiaan Fluit (族群 图 }、Ben Bederson 
(PDA 日 历 )、Wendy Hodges 和 Timothy Rowe (有 和 角 蜥 蝎 )、Keith Andrews (InfoSky), Chia 
Shen (交互 桌面 ) 以 及 Marcus Watson (声学 编码 ) 。 我 对 你 们 表示 最 诚挚 的 谢意 。 

非常 感谢 本 书 每 一 稿 的 审阅 人 所 提出 的 宝贵 的 批评 意见 ， 其 中 的 一 些 意见 促使 我 对 本 书 的 
内 容 和 结构 做 了 重大 的 变动 。 我 要 特别 感谢 John Stasko、Lisa Tweedie, Catherine Plaisant、 
Par-Anders Albinsson, Harri Siirtola 和 Pourang Irani 所 提出 的 宝贵 建议 。 

感谢 伦敦 帝国 理工 学 院 媒体 中 心 的 Colin Crimshaw, Martin Sayers 和 Neville Miles 无 数 次 
耐心 地 、 专 业 地 和 创造 性 地 为 我 提供 了 对 信息 可 视 化 教学 至 关 重 要 的 各 种 静态 和 动态 的 图 片 。 
感谢 伦敦 帝国 理工 学 院 的 Ellen 和 Don 经 常 帮助 我 查阅 参考 文献 。 

培 生 教育 集团 (Simon Plumtree) 的 Elizabeth Rix 和 Vivienne Church 为 本 书 的 出 版 发 行 投 
人 了 非常 多 的 精力 。 他 们 的 热情 和 耐心 给 我 留 下 了 非常 深刻 的 印象 ， 同 他 们 一 起 工作 我 感到 非 
常 开 心 。 


最 后 ， 我 要 感谢 这 样 一 群 人 ， 他 们 不 是 信息 可 视 化 专家 ， 但 从 很 多 方面 对 我 的 工作 给 予 了 
无 私 的 帮助 。 特 别 感谢 Annie、Bill、Wendy 和 Wiesia。 

作者 和 出 版 商 非常 感谢 以 下 人 员 对 版 权 所 有 资料 的 翻拍 授权 : 

感谢 Ken Garland 对 图 1-5 Harry Beck 的 照片 的 翻拍 许可 。 感 谢 美 国 国家 环境 保护 局 空气 质 
量规 划 和 标准 办 公 室 空气 质量 分 析 小 组 的 David Mintz 对 图 3-19 的 翻拍 许可 。 图 3-25 得 到 Dan 
Smith 的 《The State of the World Atlas》( 第 6 版 ) 的 翻拍 许可 (Myriad Editions/www.Myriad- 
Editions.com 版 权 所 有 )。 图 3-78 来 自 H.F. Stingmore (1927 年 ) 设计 的 伦敦 地 铁 地 图 。 图 3-79 
来 自 Harry Beck (1933 年 ) 设计 的 伦敦 地 铁 地 图 (伦敦 交通 博物 馆 版 权 所 有 ) 。 图 4-29 来 自 
www.streetmap.co.Uk， 得 到 Collins Maps 和 Atlases 的 翻拍 许可 。 

有 些 材 料 我 们 无 法 找到 版 权 所 有 者 ， 若 有 人 能 提供 相应 信息 ， 我 们 将 不 胜 感激 。 
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有 人 曾经 评论 Robert Spence 在 他 的 研究 领域 中 过 着 双重 生活 。 人 机 交互 (Human- 
Computer Interaction, HCI) 领域 的 专家 们 不 了 解 他 对 数字 电路 的 理论 和 设计 所 做 出 的 大 量 先 
驱 性 工作 。 同 样 ， 数 字 电 有 路 领域 的 专家 们 也 不 知道 他 对 人 机 交互 领域 的 贡献 。Robert Spence 在 
这 两 个 看 似 迎 然 不 同 的 领域 内 所 做 出 的 杰出 贡献 令 他 获得 了 多 个 博士 头衔 。HCI 和 电路 设计 这 
两 个 领域 的 区 别 是 显而易见 的 ， 然 而 ，Robert Spence 在 HCI 领 域 的 初始 工作 正 是 源 于 为 数字 电 
路 设计 师 寻 找 有 效 设计 工具 的 需求 。 这 一 因素 驱动 了 用 于 电路 设计 的 第 一 个 交互 式 图 形 工具 
MINNIE 的 诞生 。 随 后 MINNIE 展 示 了 它 的 商业 价值 : Robert Spence 创 立 了 一 家 公司 ， 并 任 董 
事 长 ， 对 MINNIE 进 行 了 研发 和 商业 运作 。 在 20 世 纪 60 年 代 末 及 20 世 纪 70 年 代 初 ， 虽 然 信 息 可 
视 化 这 一 术语 尚未 出 现 ， 但 Robert Spence 及 其 团队 的 先驱 性 工作 就 已 催生 了 很 多 早期 的 信息 可 
视 化 技术 。 有 评论 认为 屏幕 计算 器 就 是 由 Robert Spence 的 团队 率先 提出 并 实现 的 。 他 的 团队 在 
最 近 20 年 间 见 证 了 信息 可 视 化 工具 在 20 世 纪 90 年 代 的 爆炸 式 发 展 ， 同 时 在 很 大 程度 上 受到 了 
来 自 工程 设计 师 的 需求 鼓励 。 

Robert Spence 对 HCI 做 出 的 最 知名 的 贡献 当 数 在 1980 年 和 Mark Apperley ( 现 就 职 于 新 西 
兰 怀 卡 托 大 学 ) 共同 提出 的 首 个 焦点 + 上 下 文 的 双 焦 显示 技术 。 自 此 以 后 ， 该 技术 催生 了 信息 
可 视 化 领域 内 的 大 量 研究 活动 ， 相 关 技 术 的 应 用 也 已 经 商业 化 。 

目前 ，Robert Spence 是 伦敦 帝国 理工 学 院 信 息 工程 学 的 名 誉 退休 教授 。 他 现在 仍 在 教授 电 
子 工程 和 人 机 交互 方向 的 课程 。 他 目前 的 研究 兴趣 主要 集中 在 “快速 序列 视觉 表示 ”这 一 新 颖 
技术 。 除 此 之 外 ， 他 的 大 部 分 时 间 都 花 在 了 全 世界 范围 的 信息 可 视 化 课程 的 教学 上 :“ 只 要 有 
必要 的 教学 任务 我 就 会 旅行 ”是 他 的 座右铭 。 

Robert Spence 的 杰出 贡献 令 他 在 1990 年 成 功 地 获得 了 英国 皇家 工程 院 (相当 于 美国 国家 工 
程 院 ) 的 资助 。 

以 下 是 本 书 作者 的 其 他 出 版 物 : 

。 («Linear Active Networks》(1970 年 ，Wiley) 

。 《Tellegen's Theorem and Electrical Networks》(1970 年 ，MIT 出 版 社 )， 与 Penfield 和 

Duinker 合 著 ， 现 有 俄 文 和 中 文 译本 

¢ «Resistive Circuit Theory) (19744£, McGraw-Hill) 

¢ «Modern Network Theory-An Introduction) (19784, Georgi), ‘Brayton, Chua#l 

Rhodes 合 著 

¢ «Sensitivity and Optimisation》(1980 年 ，Elsevier)， 与 Brayton 合 著 

e «Computer-aided Circuit Design} (1980 年 ，Prentice-Hall) ， 与 Burgess 合 著 

* «Tolerance Design of Electrical Circuits》(1988 年 ，Addison-Wesley) ， 与 Soin 合 著 。 现 

有 日 文 译本 
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陈 雅 苦 ， 女 ， 博 士 ， 西 南 民族 大 学 计算 机 科学 与 技术 学 院 教 师 ， 教 授 “ 数 据 结 构 ”、“ 信 息 
可 视 化 ”、“ 人 机 交互 ”等 专业 课程 。2007 年 获 国家 留学 基金 委 (CSC) 全 额 奖学金 资助 赴 德国 
慕尼黑 大 学 从 事 人 机 交互 方向 的 博士 学 位 研究 。 主 要 研究 兴趣 包括 人 机 交互 、 信 息 可 视 化 、 信 
息 检 索 和 推荐 系统 等 。 其 间 积 累 了 丰富 的 交互 式 设计 经 验 ， 对 信息 可 视 化 的 研究 背景 、 现 状 及 
存在 问题 有 较 深 的 认识 。 由 于 科研 教学 表现 突出 ， 于 2009 年 10 月 ~2009 年 12 月 间 获 德国 德 意 
志学 术 交 流 中 心 (DAAD) STIBET 科 研 助 教 奖学金 。2010 年 以 “优秀 ”成 绩 获得 德国 慕尼黑 
大 学 自然 科学 博士 学 位 。 
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在 过 去 15 一 20 年 间 ， 信 息 可 视 化 应 用 得 到 了 飞速 发 展 ， 这 一 发 展 得 益 于 计算 机 及 相关 技术 
的 普及 。 信 息 可 视 化 (Information Visualization, IV) 的 本 质 可 以 通过 以 下 四 个 诞生 时 间 远 早 
于 计算 机 的 经 典 例子 得 以 充分 展示 。 

图 1-1 是 一 幅 由 拿破仑 的 绘图 师 Monsieur Minard 绘 制 的 地 图 。 该 图 描述 了 拿破仑 的 军队 从 
波兰 和 俄罗斯 交接 处 东 征 莫斯科 以 及 之 后 的 撤退 。 大 多 数 看 到 这 幅 地 图 的 人 都 不 需要 询问 就 可 
以 看 出 地 图 中 线条 的 粗细 代表 军队 中 的 士兵 数 ， 灰 色 表 示 进 军 而 黑色 表示 撤退 。 我 们 可 以 清楚 
地 看 到 ，44 万 士兵 跟随 拿破仑 出 征 ， 但 是 最 终 只 有 1 万 人 幸存 了 下 来 。 地 图 下 方 标注 了 军队 撤 
退 途 中 遭遇 到 的 罕见 低温 。 军 队 横 渡 Berezina 河 时 河面 的 冰 层 还 不 够 结实 ， 导 致 士兵 数量 急剧 
减少 。 总 的 来 说 ， 我 们 不 需要 仔细 阅读 相关 资料 就 能 从 这 幅 地 图 中 获得 关于 这 次 东 征 的 大 量 信 
息 。 即 使 不 再 看 这 幅 地 图 , 它 的 重要 特点 也 将 在 很 长 一 段 时 间 后 仍 停留 在 我 们 的 脑海 里 。 当 然 ， 
我 们 也 应 该 注意 到 这 幅 地 图 完全 不 适合 作为 征兵 宣传 画 。 





图 1-1 Minard 地 图 描述 了 拿破仑 东 征 莫斯科 及 撤退 的 情况 。 图 片 来 源 : Tufte (1983) 


第 二 个 例子 来 自 于 Florence Nightingale (1858) 写 给 英国 政府 的 一 份 报告 。 报 告 记录 了 她 
在 1858 年 的 克 里 米 亚 半 岛 战争 中 对 Scutari 医 院 所 做 的 改革 。 她 设计 了 如 图 1-2 所 示 的 图 表 ， 图 
中 每 个 放射 状 部 分 的 面积 同 医院 每 个 月 的 死亡 人 数 成 正比 ， 角 度 大 小 同 该 月 内 的 天 数 成 正比 。 
从 图 中 可 以 清晰 地 看 到 ， 从 Nightingale 引 入 改革 后 医院 死亡 人 数 逐 月 下 降 。 作 为 对 比 ， 图 表 中 
心 的 圆圈 表示 同时 期 英格兰 的 一 家 军医 院 。Nightingale 通 过 这 样 一 个 清晰 而 简单 的 图 表 向 英国 
政府 形象 地 展示 了 她 的 改革 成 果 。 同 样 ， 我 们 不 需要 回顾 这 个 图 表 就 能 深刻 地 记 住 Nightingale 
的 改革 成 果 和 对 “玫瑰 花 闪 ”图 表 的 视觉 记忆 9S。 


© Nightingale 报 告 的 附录 中 附 有 非常 详尽 的 处 方 。 我 们 强烈 建议 在 细 读 Crimean 医 院 的 细节 前 应 仔细 研究 
Nightingale 或 其 他 人 的 处 方 。 
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图 1-2 Florence Nightingale 的 图 表 显 示 在 她 引入 一 系列 改革 措施 后 Scutari 医 院 死亡 人 数 大 幅 下 降 。 
图 片 来 源 : Nightingale (1858) 


第 三 个 例子 源 自 1854 年 一 场 袭 击 了 伦敦 Soho 区 的 霍乱 。 当 时 负责 疫情 控制 的 是 伦敦 地 区 
的 医务 官 John Snow 医 生 。 图 1-3 是 一 幅 该 区 的 地 图 ， 其 中 点 表示 死亡 地 点 ,又 表示 居民 取水 点 。 
在 仔细 研究 了 该 地 图 后 ，Snow 发 现 大 多 数 死亡 集中 在 Broad 街 的 取水 点 附近 。 他 随即 决定 关闭 
该 取水 点 。 实 施 这 一 措施 后 ， 霍 乱 死亡 人 数 有 所 下 降 (Tufte, 1997)。 我 们 注意 到 附近 一 家 酿 
酒 厂 的 工人 中 得 霍乱 的 人 数 相 对 较 少 ， 至 于 原因 大 家 可 以 充分 发 挥 自己 的 想象 力 。 为 了 纪念 
Snow 的 贡献 ， 一 家 当年 Broad 街 ( 现 已 令 人 费解 地 改名 为 Broadwick 街 ) 取水 点 附近 的 俱乐部 
以 Snow 的 名 字 命名 〈 见 图 1-4) 。 





图 1-3 1845 年 伦敦 Soho 地 区 地 图 ， 图 中 显示 了 霍乱 死亡 人 数 (点 ) 和 取水 点 位 置 ( 叉 )。 图 片 来 
W: Tufte (1983) 
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图 1-4 位 于 伦敦 Broadwick 街 的 John Snow 俱 乐 部 © 图 1-5 著名 的 伦敦 地 铁 地 图 的 发 明 者 Harry Beck。 图 
片 来 产 : Ken Garland 





最 后 ， 我 们 来 看 一 个 比较 近代 的 例子 。1931 年 ，Harry Beck ( 见 图 1-5) 是 一 位 失业 的 制 
图 人 。 然 而 ， 用 Bill Bryson (1998) 的 话 来 说 ，Harry Beck “意识 到 当 处 于 地 下 时 ， 人 们 所 在 
的 位 置 并 不 重要 ， 只 要 所 有 站 台 按 正确 顺序 排列 并 且 换 乘 信息 清晰 明确 ， 就 能 任意 地 调整 甚至 
取消 比例 尺 。 他 赋予 了 地 图 类 似 电 信和 网 的 有 序 性 和 和 精度， 从 而 创造 了 一 个 全 新 的 与 地 面 城市 杂 
乱 的 地 理 信息 完全 无 关 的 地 下 伦敦 (London Underground)”。 起 初 人 们 并 不 确定 Beck 的 这 个 想 
法 是 否 是 个 好 主意 ， 他 获得 的 微薄 报酬 和 该 图 在 世界 范围 内 对 大 多 数 交 通 系 统 图 的 深远 影响 形 
成 了 鲜明 的 对 比 (Ovenden, 2003), Harry Beck 的 故事 是 奇妙 的 (Garland, 1994) 。 和 前 面 三 个 
例子 一 样 ， 这 幅 交通 图 给 读者 留 下 了 深刻 的 印象 。 对 于 在 伦敦 生活 和 工作 的 人 们 来 说 ， 这 幅 
“管道 图 ”易于 记忆 (虽然 没 提供 全 部 细节 )， 并 且 有 助 于 旅程 规划 。 


1.1 可 视 化 


以 上 四 个 例子 的 共性 在 于 读者 观看 这 些 图 表 后 得 到 的 结论 。 人 们 无 须 画 草 图 或 记 笔记 ， 也 
没有 用 到 任何 的 计算 机 技术 ， 结 论 完 全 产生 于 观 者 的 大 脑 中 。 我 们 可 以 说 : 得 出 这 些 结论 需要 
信息 启示 (insight) 或 理解 ， 这 和 了 可视化 的 字典 定义 一 致 : 

可 视 化 ”对 某 事物 建立 心理 模型 (mental model) 或 心理 图 像 (mental image) 。 

因此 ， 可 视 化 是 和 计算 机 无 关 的 纯粹 的 人 类 认 知 活动 。 需 要 指出 的 是 ， 可 视 化 的 “视觉 ” 
含义 并 不 表示 这 些 活动 只 涉及 视觉 经 验 。 除 了 图 形 之 外 ， 声 音 和 其 他 感知 形式 都 可 以 用 作 数 据 
描述 。 

我 们 看 到 ， 信 息 可 视 化 活动 可 以 总 结 为 如 图 1-6 所 示 的 简单 图 表 : 以 某 种 形式 表示 的 数据 
(data) 被 转化 为 图 形 ， 由 用 户 对 其 进行 解释 。 图 中 用 “Ah HA!!” 来 表示 用 户 看 到 数据 图 形 编 
码 并 发 现 有 用 信息 后 的 反应 。 为 了 表明 用 户 对 数据 的 理解 过 程 ， 图 1-6 将 数据 和 信息 做 了 明确 
的 区 分 。 信 息 可 视 化 的 主要 任务 是 帮助 用 户 从 数据 中 提取 信息 。 我 们 经 常 听 到 的 信息 过 载 从 本 
质 上 来 讲 应 该 叫做 数据 过 载 : 信息 过 载 也 许 只 是 一 种 期 待 中 的 奢侈 ! 
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—_ 
b= 
信息 可 视 化 
图 1-6 信息 可 视 化 过 程 。 通 过 观察 数据 的 图 形 编码 来 为 其 构建 心理 模型 ( 见 彩 图 ) 


我 们 观察 
该 图 








图 1-6 中 的 数据 有 多 种 类 型 。 例 如 ，Minard 地 图 中 的 温度 是 数值 型 数据 (numerical data 或 
quantitative data) ， 分 别 表 示 进 军 和 撤退 的 灰色 ( 原 图 中 为 红色 ) 和 黑色 属于 顺序 型 数据 
[5] (ordinal data) ，Snow 的 Soho 地 图 中 分 别 表 示 为 点 和 又 的 死亡 地 点 和 取水 点 属于 类 别 型 数据 
(categorical data) 。 关 系 (relationship) 数据 在 Beck 的 管道 图 中 得 到 了 最 好 的 体现 。 作 为 重要 
性 不 断 增长 的 一 种 数据 类 型 ， 文 字 不 包含 特定 的 顺序 或 数值 ， 因 而 属于 类 别 型 数据 。 无 论 数据 

本 质 如 何 ，Simon (1996) 的 评论 简明 地 体现 了 信息 可 视 化 的 基本 思想 : 


CE 


… 解 决 一 个 问题 意味 着 用 某 种 方法 对 其 进行 描述 ， 从 而 使 得 解决 方案 透明 化 。 


当然 ， 要 找到 有 效 的 数据 描述 方法 并 不 容易 ， 这 也 是 信息 可 视 化 领域 从 业者 和 研究 人 员 的 
主要 挑战 和 迷人 之 处 。 

在 讨论 计算 机 为 什么 可 以 支持 以 及 如 何 支持 可 视 化 活动 前 ， 我 们 认为 有 必要 强调 数据 的 纸 
型 (paper-based) 显示 的 重要 性 。 正 如 一 幅 简 单 直观 的 图 表 能 帮助 Florence Nightingale 说 服 英 
国政 府 一 样 ， 这 样 的 图 表 可 以 加 深 对 方 对 你 的 印象 ， 从 而 帮助 你 从 风险 投资 家 手中 得 到 资金 ， 
从 教授 那里 得 到 积极 评估 ， 或 者 加 深 诈 骗 案 审判 中 陪审 团 对 你 的 好 感 。 很 多 情况 下 ， 数 据 的 有 
效 描述 将 起 到 决定 性 的 作用 。 对 于 读者 而 言 ， 直 观 的 图 表 比 直 白 的 文字 更 持久 也 更 易于 回想 。 
例如 ， 此 时 你 也 许 不 需要 翻 到 前 面 的 章节 就 能 回忆 起 Minard、Nightingale、Snow 和 Beck 所 绘 
图 表 中 的 重要 信息 9。 


1.2 计算 支持 


在 最 近 15 一 20 年 间 ， 计 算 机 成 为 推动 信息 可 视 化 领域 快速 发 展 的 重要 因素 之 一 。 
其 主要 原因 有 三 。 首 先 ， 价 格 不 断 降 低 、 存 取 速 度 不 断 提高 的 存储 器 使 得 对 公司 (特别 是 
保险 业 和 制药 业 ) 和 政府 海量 数据 的 存储 变 得 现实 。 其 次 ， 不 断 提 高 的 计算 能 力 允 许 对 数据 子 
CE] 集 进 行 快速 交互 的 选取 以 支持 灵活 的 探索 9S。 第 三 ， 高 分 辩 率 图 形 显示 器 保证 了 数据 描述 与 人 
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其 他 代表 性 的 信息 可 视 化 例子 可 参见 Tufte (1983) 的 书 以 及 Michael Friendly 的 图 片 库 (http://www.math. 
yorku.ca/SCS/Gallery ) 。 

当 用 户 不 能 根据 需求 对 数据 做 选择 时 ， 情 况 就 有 所 不 同 了 。 荷 兰 火车 站 的 纸 质 海报 就 是 一 个 典型 的 例子 。 
它 可 以 帮助 旅客 查 明 从 当前 站 点 到 任 一 目的 地 的 路 线 。 面 对 纸 质 海报 ， 用 户 无 法 进行 眼球 运动 以 外 的 任何 
选择 操作 。 读 者 可 能 会 想到 的 一 个 解决 办 法 是 允许 旅客 选择 个 性 化 数据 ， 但 在 本 书 的 后 续 章 节 中 我 们 将 看 
到 这 一 方法 的 实现 将 面临 很 多 的 困难 。 先 进 的 交互 式 信息 可 视 化 并 不 能 抹杀 数据 静态 描述 的 价值 。 在 本 书 
的 后 续 章节 中 我 们 将 看 到 在 某 些 情况 下 对 同一 数据 的 静态 描述 所 花费 的 用 户 认 知 成 本 要 比 动态 描述 低 。 


第 1 章 什么 是 可 视 化 "5 


类 视觉 和 感知 系统 的 匹配 。 下 面 的 两 个 例子 将 简要 地 展示 计算 机 在 这 三 个 方面 的 优势 。 

Spotfire “是 一 个 强大 的 可 视 化 工具 ， 主 要 用 于 制药 业 的 新 药 研制 8 。 在 药品 研发 初期 必须 
对 成 千 上 万 种 物质 的 多 种 属性 进行 检查 。 将 如 此 大 量 的 数据 存 和 人 如 图 1-7a 所 示 的 传统 表格 中 并 
不 能 降低 理解 的 难度 。Spotfire™ 允 许 经 过 训练 的 用 户 选 取 某 个 数据 子 集 ， 系 统 将 其 表示 为 更 
易于 理解 的 多 种 视觉 形式 ， 用 户 可 以 与 之 交互 以 检查 其 分 子 结构 ( 见 图 1-7b)。 在 新 药 研制 过 
程 中 需要 用 到 大 量 类 似 的 数据 视觉 描述 。 
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a) 用 于 新 药 研究 的 表格 。 该 表格 中 有 多 行 代表 化 合 物 的 数据 。 每 种 化 合 物 拥有 14 项 属性 。 
从 该 表格 中 获取 信息 启示 是 很 困难 的 
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b) 对 表格 数据 的 视觉 编码 可 以 增强 理解 。 在 本 例 中 ， 图 表 的 坐标 分 别 为 属性 “ID" 和 
“Assay 卫 。 颜 色 和 形状 均 表 示 是 否 通过 了 某 种 提纯 测试 ， 大 小 表示 分 子 重量 。 某 种 化 合 
物 经 过 识别 后 ， 其 分 子 结构 将 显示 在 左边 (图片 感谢 Spotfire 公 司 韦 允 ) 


图 1-7 用 于 新 药 研究 的 表格 及 对 表格 数据 的 视觉 编码 ( 见 彩 图 ) 

第 二 个 简单 例子 展示 了 数据 视觉 描述 重组 (rearrangement) 的 价值 。 图 1-8a 展 示 了 对 10 种 
玉米 品种 做 7 种 不 同 处 理 (例如 喷雾 或 施 化 肥 等 ) 的 实验 结果 。 墨色 和 白色 方块 分 别 代表 成 功 
和 不 成 功 的 处 理 方式 。 将 图 1-8a 所 示 矩 阵 的 部 分 行 和 列 稍 做 调整 即 可 得 到 图 1-8b: 从 中 可 以 立 

伍 ” 和 我 们 对 可 视 化 的 定义 -- 致 ， 我 们 将 可 视 化 工具 定义 为 显示 (通常 为 ) 视觉 编码 的 数据 并 支持 可 视 化 过 程 

视图 的 计算 机 系统 。 和 通常 的 看 法 不 同 ， 我 们 认为 不 能 简单 地 用 “可 视 化 ” 一 词 来 描述 在 屏幕 上 所 看 到 的 


AR. 


6 "第 1 章 什么 是 可 视 化 


即 发 现 某 些 处 理 方式 对 特定 的 玉米 品种 有 效 。 当 然 ， 这 些 发 现 会 令 农业 专家 产生 一 些 疑 问 ， 进 
而 对 其 他 数据 做 检查 以 期 对 这 些 发 现 做 进一步 的 解释 。 这 个 例子 说 明 可 视 化 通常 需要 对 数据 的 
不 同 视 觉 描述 做 反复 检查 。 本 例 展 示 了 数据 描述 的 优势 以 及 合适 的 算法 对 交互 式 探索 的 帮助 ， 
图 1-8 只 是 其 中 最 简单 的 一 个 实例 。 





处 理 方式 处 理 方式 
ABCDEFG ADCEGBF 
1 1 
2 重组 3 
3 8 
4 2 
EK 5 玉米 6 
6 
7 4 
8 7 
9 9 
10 5 
a) b) 


图 1-8 对 数据 的 视觉 描述 进行 重组 有 助 于 发 现 新 的 信息 启示 


通过 以 上 两 个 例子 的 讨论 再 加 上 亲身 经 历 ， 读者 可 以 体会 到 在 不 同 的 数据 子 集 之 间 进 行 灵 
活 切换 的 价值 。 安 排 到 旅游 目的 地 的 航班 就 是 这 样 一 个 典型 的 例子 。 如 果 是 通过 Web 进 行 此 项 
操作 ， 用 户 将 查看 大 量 的 网 页 (视图 ) 以 构建 心理 模型 ， 其 中 包括 可 供 选择 的 航班 时 刻 
(“Granny 能 否 赶 上 这 么 早 的 航班 ?””)、 可 能 的 路 线 〈(“ 如 果 能 在 比萨 稍 作 停 留 ， 看 看 比萨 斜 塔 
就 好 了 )、 总 费用 、 特 价 信息 、 不 同 的 航空 公司 等 。 另 外 还 有 一 些 来 自 工业 和 商业 的 例子 ,新 
药 研制 中 的 决策 判断 (Spotfire) 、 芯 片 生产 线 的 控制 (Inselberg, 1997) 以 及 犯罪 活动 调查 
(Davidson, 1993, Westphal and Blaxton, 1998) 等 。 在 所 有 这 些 例子 中 ， 现 代 计 算 机 技术 有 助 
于 数据 多 种 视图 的 生成 。 这 些 应 用 同时 也 得 益 于 高 分 辩 率 的 图 形 显 示 器 : 在 某 些 例 了 中 
(Keim et al., 1993) ， 每 个 像素 都 被 充分 利用 起 来 以 形成 一 个 方便 用 户 理解 的 显示 图 像 。 

早 在 30 年 前 人 们 就 已 经 认识 到 强大 的 计算 能 力 和 高 分 辩 率 显示 器 对 信息 可 视 化 的 重要 性 。 
在 图 1-9 所 示 的 电路 图 中 ， 圆 形 的 大 小 代表 部 件 属性 的 改变 对 电路 整体 性 能 的 影响 (Spence 
and Drew, 1971)。 在 同样 的 电路 设计 背景 下 ， 图 1-10 所 示 的 即时 反应 的 交互 式 界面 (Spence 
and Apperley, 1974) 允许 设计 师 通过 调节 右 侧 的 滑 块 来 手动 修改 某 个 部 件 的 属性 ， 并 且 可 以 
立即 (例如 在 0.2 秒 之 内 ) 看 到 该 修改 对 电路 性 能 的 影响 。 该 例子 是 “动态 查询 ”(dynamic 
querying) 的 一 个 早期 应 用 。 














yo 
( | see Y | 
| / >: | 
| 
| | 
| 
k g | 
频率 | 
图 1-9 贺 形 的 大 小 表示 部 件 对 电路 整体 性 能 图 1-10 该 界面 允许 用 户 动态 地 查看 部 件 属性 


的 影响 的 改变 对 电路 整体 性 能 的 影响 
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1.3 人 类 用 户 


我 们 在 1.2 节 中 讨论 了 计算 机 及 其 相关 技术 在 信息 可 视 化 领域 (特别 在 近 几 十 年 间 ) 的 重 
要 性 。 我 们 应 该 意识 到 人 类 用 户 是 如 何 进行 数据 交互 的 ， 交 互 设 计 者 只 有 在 理解 了 用 户 的 需 
求 及 行为 特点 后 才能 更 好 地 设计 数据 描述 和 图 形 表示 。 为 了 强调 这 一 认 知 的 重要 性 ， 我 们 将 
讨论 三 个 和 信息 可 视 化 直接 相关 的 人 类 行为 模式 。 可 能 有 些 读者 会 觉得 有 些 发 现 是 令 人 难以 
置信 的 。 

第 一 个 实验 的 素材 是 一 段 视频 ， 主 要 内 容 是 6 个 人 在 一 个 狭小 空间 内 跑 动 并 相互 传 球 。 参 
与 者 被 要 求 观看 这 段 视频 一 分 钟 ， 并 统计 某 个 特定 女生 接触 到 球 的 次 数 。 在 这 段 视频 中 出 现 了 
第 7 个 装扮 成 一 只 大 猩猩 的 人 ， 他 走 入 人 群 中 ， 拍 打 胸 部 然后 走出 画面 。 虽 然 这 次 出 现在 大 家 
全 神 贯 注 观 察 的 画面 中 的 侵扰 显得 奇怪 并 且 不 合 时 宜 ， 但 是 所 有 参与 者 都 没 注意 到 这 个 人 1 当 
观看 回放 了 时， 部 分 参与 者 其 至 怀疑 观看 的 是 否 是 同一 段 视频 。 这 种 现象 称 为 非 注 意 盲 视 
(inattentional blindness) (Simons and Chabris, 1999), 由 于 信息 可 视 化 需要 用 户 聚 焦 于 显示 内 
容 ， 非 注意 请 视 所 带 来 的 损失 是 显而易见 的 。 在 意识 到 这 一 现象 后 ， 人 们 可 以 想象 许多 事故 报 
告 (“信息 正 盯 着 操作 员 但 他 没 并 注意 到 ”) 可 能 需要 重新 修订 。 

在 第 二 个 实验 中 ， 参与 者 被 要 求 观看 两 张 反复 交替 出 现 的 图 片 并 被 告知 这 两 张 图 片 是 不 同 
的 。 尽 管区 别 明显 ， 很 多 参与 者 仍 花 费 了 15 秒 以 上 的 时 间 才 找到 不 同 之 处 。 这 个 现象 叫做 变化 
HW (change blindness) (Rensink, 2002)。 由 于 大 多 数 信息 可 视 化 工具 涉及 对 数据 视图 变化 
的 观察 ， 因 此 变化 宣 视 对 用 户 判断 的 影响 也 是 很 明显 的 。 

第 三 个 实验 强调 了 可 视 化 对 数据 的 心理 模型 (通常 也 叫 内 部 模型 (internal model) 或 认 知 
图 (cognitive map)) 的 依赖 。Tversky (1993) 强调 将 主观 印象 当做 信息 感知 唯一 途径 的 危险 
性 ， 并 指出 了 认 知 拼 贴 图 (cognitive collage) 的 存在 。 例 如 ， 对 于 “Reno 和 Los Angeles 哪 个 
更 靠 西 ? ”这 个 问题 ， 由 于 Los Angeles 属 于 加 利 福 尼 亚 州 ， Reno 属 于 内 华 达 州 ， 而 内 华 达州 
在 加 利 福 尼 亚 州 的 东 面 ， 因 此 一 个 常见 的 却 是 错误 的 回答 ( 见 图 1-11) Æ “Los Angeles”, ix 
个 例子 展示 了 对 这 些 模型 虽然 简单 但 却 是 错误 的 组 合 。 





图 1-1] 一 幅 显 示 了 加 利 福 尼 亚 州 、 内 华 达 州 以 及 两 个 城市 Los Angeles 和 Reno 的 地 图 。 该 图 展示 
了 “ 认 知 拼 贴图 ”的 概念 
以 上 列举 的 三 个 例子 (更 多 的 实例 可 参见 参考 文献 ) 明确 地 指出 ， 交互 设计 者 必须 对 用 户 
特点 有 深刻 的 认识 才能 设计 出 实用 、 有 效 的 应 用 。 这 也 是 我 们 在 适 当时 机 对 人 类 认 知 和 感知 处 
理 进行 介绍 的 原因 。 对 这 方面 感 兴趣 的 读者 可 阅读 Ware (2004) 的 这 一 优秀 的 参考 文献 。 
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1.4 信息 可 视 化 的 价值 


毫 无 疑问 ， 信 息 可 视 化 是 一 个 非常 有 趣 的 课题 ， 但 关于 它 的 价值 一 直 存 在 着 和 争论。 回答 这 
个 问题 最 有 效 的 方法 是 举 出 实际 例子 ， 接 下 来 我 们 就 将 通过 三 个 例子 来 讨论 这 个 问题 。 


1.4.1 诈骗 案 

英国 严重 诈骗 案 办 公 室 花费 了 8 年 工作 时 间 检 查 了 48 个 抽 居 的 文档 ， 终 于 锁定 了 一 起 建 房 
会 诈骗 案 的 犯罪 嫌疑 人 (Davidson, 1993) 并 将 其 送 上 法 庭 ， 最 终 该 犯罪 嫌疑 人 被 裁定 为 有 
罪 。 然 而 ,一 位 独立 调查 人 仅 花 了 4 周 时 间 就 通过 一 个 信息 可 视 化 工具 锁定 了 那 位 犯罪 嫌疑 人 ， 
工作 效率 提高 了 大 约 100 倍 。 不 仅 如 此 ， 在 这 4 周 内 他 还 查 出 了 隐藏 在 该 犯罪 嫌疑 人 背后 的 犯罪 
主谋 。 这 个 故事 吸引 我 们 的 地 方 在 于 极其 简单 的 基于 直线 的 数据 显示 方式 (详情 参见 第 3 章 ) 。 


1.4.2 芯片 设计 


《财富 》 杂 志 的 一 篇 报道 向 芯片 制造 业者 展示 了 信息 可 视 化 的 强大 作用 : 

Texas Instruments 公 司 为 微 处 理 器 生产 晶片， 制造 过 程 涉及 400 多 个 生产 步骤， 通常 持续 数 
周 。 监 测 过 程 中 将 为 每 个 唱片 收集 14 万 条 信息 ， 其 中 革 些 信息 是 系统 故障 的 报错 消息 。 依 靠 这 
些 信息 ， 生 产 商 可 以 在 不 合格 芯片 生产 出 来 之 前 就 及 时 地 发 现 问题 。 


1.4.3 制药 业 


我 们 可 以 在 制药 业 中 找到 类 似 的 实例 。Sheldon Ort 曾 在 《财富 》 杂志 的 访问 中 谈 到 ; 

Eli Lilly 公 司 有 1500 位 科学 家 使 用 先进 的 信息 可 视 化 工具 Spotfire 进 行 新 药 研 制 。 它 可 以 显 
示 多 源 信 息 并 允许 交互 式 地 改变 视图 。 这 些 功 能 帮助 我 们 对 特定 分 子 进 行 观察 ， 从 而 决定 是 否 
对 其 进行 进一步 的 研究 。 

Spotfire 公 司 2005 年 的 年 收益 达到 了 3500 万 美元 ， 这 也 从 一 个 侧面 证 实 了 Spotfire 的 强大 
功能 。 


1.5 相关 领域 


村 学 可 视 化 和 地 理 可 视 化 是 两 个 和 信息 可 视 化 相关 并 且 有 一 定 交叉 的 研究 领域 。 它 们 的 共 
同 目标 是 帮助 用 户 加 深 对 数据 的 理解 。 在 科学 可 视 化 中 ， 用 户 所 见 通常 和 某 一 具体 物理 “事物 ” 
相关 。 例 如 ， 用 不 同 的 颜色 代表 有 角 蜥 蝎 表皮 和 骨骼 间 的 距离 ( 见 图 1-12) ， 或 者 在 等 高 线 的 基 
础 上 对 云层 成 因 进行 分 析 。 相 对 而 言 ， 信 息 可 视 化 主要 关注 “抽象 ”概念 ， 如 价格 、 棒 球 比赛 
得 分 、 汇 率 浮动 以 及 家 庭 关 系 等 。 虽 然 这 些 抽象 概念 对 应 于 硬币 、 棒 球 棍 、 美 元 外 债 和 人 等 具 
体 的 物理 事物 ， 但 并 不 需要 对 这 些 物理 事物 进行 描述 ， 汇率 炒家 理应 知道 一 张 10 美 元 钞 夏 的 样 
子 而 不 需要 系统 为 其 显示 一 张 钞票 图 片 来 支持 他 的 交易 。 和 科学 可 视 化 类 似 ， 地 理 可 视 化 通 党 
在 一 幅 地 图 的 基础 上 进行 数据 显示 。 例 如 ， 图 1-13 中 分 别 显示 了 1881 年 和 1998 年 英国 人 口中 
Spence 姓 氏 的 地 理 分 布 。 和 Minard、Snow 以 及 Beck 的 例子 一 样 ， 我 们 会 在 本 书 的 后 续 章 节 中 对 
该 例 中 用 到 的 编码 方法 进行 具体 讨论 。 科 学 可 视 化 和 地 理 可 视 化 通常 涉及 空间 内 容 ， 而 信息 可 视 
化 一 般 涉及 工程 和 人 金融 交易 等 抽象 的 非 空 间 数据 。 当 然 ， 这 三 者 之 间 还 是 存在 着 一 定 的 交叉 


日 对 地 理 信 息 化 感 兴趣 的 读者 可 参见 MacEachren (2004) 一 书 。 
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图 1-12 X 光 扫描 图 像 重 建 图 。 用 不 同 的 颜色 显示 美国 得 克 萨 斯 州 有 角 蜥 蝎 和 墨西哥 有 角 蜥 蝎 的 外 
皮 和 骨骼 之 间 的 距离 (图片 感谢 Wendy Hodges 博 士 、Timothy Rowe 博 士 以 及 Digimorph.org 
MI) ( 见 彩 图 ) 


1881 ¥ 1998 { 口 最 少 





Ee 
图 1-13 1881 年 和 1998 年 英国 人 口中 Spence 姓 氏 的 地 理 分 布 〈 见 彩 图 ) 
读者 也 许 已 经 注意 到 了 科学 、 地 理 和 信息 可 视 化 之 间 界 定 的 模糊 。 研 究 者 正在 致力 于 对 这 
三 者 进行 更 精确 的 定义 。 和 传统 定义 不 同 ，Tory 和 Moller (2004) 认为 该 定义 应 基于 用 户 对 信 
息 的 心理 模型 ， 这 一 观点 和 我 们 在 信息 可 视 化 定义 中 对 认 知 的 强调 一 致 。 值 得 关注 的 是 如 何 采 
用 这 些 新 的 定义 以 增强 交互 式 设计 。 


1.6 术语 


本 章 主要 介绍 了 信息 可 视 化 的 定义 、 发 展 、 用 途 以 及 用 户 在 信息 可 视 化 过 程 中 扮演 的 重要 
角色 。 虽 然 我 们 已 经 遇 到 了 一 些 影响 应 用 设计 有 效 性 的 重要 术语 ， 但 本 章 并 未 对 它们 做 特别 的 
解释 。 

这 些 重 要 术语 包括 数据 描述 (representation， 数 据 编码 方法 ， 通 常 是 视觉 的 )、 数据 表示 
(Presentation ， 将 已 编码 数据 在 一 定 的 时 间 和 空间 内 表示 出 来 ) 和 交互 (interaction ， 用 户 为 实 
现 数据 视图 切换 所 采取 的 动作 )。 在 第 2 章 中 ， 我 们 将 以 汽车 购买 这 一 具体 任务 为 例 来 展示 信息 
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可 视 化 工具 的 设计 过 程 并 介绍 以 上 三 个 基本 概念 。 


习题 


建议 通过 课堂 讨论 的 形式 来 加 深 对 以 下 习题 的 理解 。 

1.1 (复习 题 ) 可 视 化 的 定义 是 什么 ? 它 是 由 用 户 还 是 计算 机 执行 的 ? 

1.2 (复习 题 ) 计算 机 技术 的 进步 在 哪些 方面 增强 了 信息 可 视 化 的 功效 ? 

1.3 不 要 翻 看 前 面 的 内 容 ， 根 据 记 忆 画 出 本 章 介绍 的 Minard、Nightingale、Snow 以 及 
Beck 的 可 视 化 实例 的 草图 ( 即 给 出 对 这 些 实例 的 心理 模型 ) 。 

1.4 记录 一 天 之 中 所 磁 到 的 数据 的 不 同 描述 形式 ， 如 视觉 、 听 觉 或 触觉 等 。 然 后 分 析 每 个 
例子 中 各 类 数据 代表 的 是 具体 的 值 (如 数值 、 顺 序 、 类 别 等 ) 还 是 关系 。 

1.5 探寻 Minard、Nightingale、Snow 以 及 Beck 的 可 视 化 实例 的 其 他 数据 描述 形式 ， 并 用 
草图 加 以 说 明 。 

16 选 定 某 样 物 理事 物 (如 一 辆 汽车 、 自 己 或 一 栋 房子 ) ， 列 出 该 事物 能 用 视觉 形式 进行 

[15 | 描述 的 特性 ， 并 用 草图 加 以 描述 。 
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基本 概念 





一 本 关于 信息 可 视 化 的 书 应 该 介绍 哪些 基本 概念 ? 本 章 将 通过 一 个 具体 的 例子 来 展示 信息 
可 视 化 工具 应 具有 的 基本 功能 。 我 们 选择 了 一 个 很 具 代表 性 的 任务 并 对 其 进行 了 深入 的 讨论 。 
虽然 我 们 只 选择 了 一 个 任务 ,但 是 它 展 示 了 大 多 数 信息 可 视 化 应 用 所 涉及 的 基本 概念 。 本 章 中 
出 现 的 重要 概念 均 用 黑体 加 以 强调 9 。 


2.1 任务 


本 章 的 中 心 任务 (task) 是 选 购 一 辆 汽车 ， 这 是 一 个 非常 典型 的 例子 : 根据 属性 从 多 个 对 
象 中 选 出 一 个 对 象 ， 或 者 从 大 量 对 象 中 选 出 一 些 备 选 对 象 进行 进一步 的 审查 。 从 一 个 数据 集中 
获取 信息 启示 (gaining insight) 是 一 个 重要 的 子 任务 ， 它 是 数据 控 气 和 决策 支持 的 重要 组 成 
部 分 。 虽 然 我 们 可 以 在 数字 信息 空间 (information space) 内 完成 汽车 选择 任务 ， 但 是 数字 信 
息 空 间 存在 着 物理 世界 中 的 对 等 物 ， 如 汽车 展厅 。 


2.2 问题 的 本 质 


考虑 到 问题 的 实际 性 ， 我 们 应 该 意识 到 所 选择 的 这 个 任务 经 常 缺少 精确 的 描述 。 常 见 的 汽 
车 选择 标准 有 “外 形 美观 "、“ 动 感 的 ”和 “负担 得 起 ”等 。 此 外 ， 购 买 者 可 能 意识 到 了 一 些 标 
准 ， 如 颜色 和 时 尚 度 等 ， 但 却 很 难 用 语言 去 描述 。 甚 至 存在 一 些 消 费 者 未 意识 到 但 可 能 影响 最 
终 选择 的 因素 。 毫 无 意外 的 ,“ 问 题 只 有 在 被 解决 时 才能 得 到 完整 的 描述 ”(Schon, 1983) 这 
一 现象 时 常 发 生 。 我 们 经 常 意识 不 到 哪些 东西 是 我 们 所 不 知道 的 。 


2.3 数据 


汽车 数据 通常 用 表格 的 形式 呈现 (presented) 给 消费 者 ( 见 图 2-1): 每 行 代表 一 辆 汽车 
(普遍 说 来 ， 代 表 某 个 对 象 (object) ) ， 每 列表 示 该 汽车 的 一 个 属性 (attribute)。 这 些 属性 可 
能 属于 不 同 的 数据 类 型 ， 数值 型 (如 价格 ) 、 类 别 型 (如 品牌 )、 顺 序 型 (如 评分 ) 等 。 有 的 属 
性 可 能 像 推 荐 一 样 包 含 文字 信息 。 







fan | ow [we [wo | smo | 
Pret | am | 






图 2-1 记录 了 一 组 对 象 (47) 的 属性 值 ( 列 ) 的 表格 





O 只 在 本 章 中 有 效 。 后 续 章 节 中 的 黑体 表示 术语 表 中 列举 的 术语 在 正文 中 第 一 次 出 现 的 位 置 。 
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2.4 表格 表示 


虽然 我 们 对 表格 非常 熟悉 ， 但 是 当 有 多 行 或 列 数 超过 10 时 ， 表 格 的 有 用 性 是 有 限 的 。 当 消 
费 者 有 非常 精确 的 需求 时 (这 种 情况 通常 很 少见 )， 可 以 对 表格 进行 人 工 扫 描 或 利用 某 些 搜索 
功能 来 定位 符合 条 件 的 汽车 。 即 使 找到 了 一 个 精确 匹配 ， 购 买 者 可 能 还 想 看 看 有 没有 其 他 的 可 
能 选择 。 即 使 没有 精确 匹配 ， 逐 行 扫描 的 办 法 对 消费 者 的 心理 模型 也 没有 太 大 帮助 。 我 们 后 面 
讨论 到 表格 透镜 (Table Lens) 时 将 看 到 ， 人 允许 按 属性 (如 价格 ) 对 表格 的 行 和 列 进行 交互 式 
重 排 (interactive rearrangement) 是 非常 有 用 的 。 


2.5 条 形 图 


所 有 汽车 属性 里 消费 者 最 关心 的 可 能 就 是 大 致 的 价格 范围 了 。 除 非 表 格 里 的 所 有 汽车 数据 
是 按照 价格 升序 或 降序 排列 的 (虽然 在 众多 属性 中 将 价格 作为 排序 标准 并 不 一 定 合理 )， 否 则 
很 难 从 中 确定 价格 范围 。 图 2-2 显 示 了 对 价格 数据 的 条 形 图 描述 (representation) 法 。 这 种 半 
定性 (semi-qualitative) 描述 假设 价格 范围 (而 非 具 体 数值 ， 至 少 在 初始 时 ) 能 提供 有 效 信息 。 
每 个 条 形 的 长 度 表 示 处 于 该 价格 段 的 汽车 数量 ， 从 而 展示 了 每 个 价格 段 内 的 汽车 数量 分 布 。 即 
使 只 是 对 该 条 形 图 的 迅速 一 警 也 能 对 所 有 汽车 的 价格 范围 和 每 个 价格 段 的 汽车 数量 分 布 形成 一 
个 有 用 的 心理 模型 (mental model) 。 我 们 可 以 认为 条 形 图 能 提供 价格 和 数量 分 布 的 总 图 


(overview), 





mask [aaj o Na O 
图 2-2 该 条 形 图 表示 了 一 组 待 售 汽车 的 价格 范围 ， 每 个 条 形 的 长 度 对 应 于 该 价格 范围 内 的 汽车 数量 


26 交互 式 对 象 选择 


在 研究 价格 总 图 前 ， 消 费 者 可 能 会 偶然 地 在 一 组 汽车 图 片 (图 2-3) 中 看 到 一 辆 特别 有 吸 
引力 的 汽车 ， 然 后 就 会 很 自然 地 查询 这 辆 车 的 价格 以 及 更 多 的 细节 (detail) 信息 。 虽 然 价格 
可 以 直接 标注 在 图 片 下 方 ， 但 是 在 可 能 多 于 10 个 的 属性 中 只 标 出 价格 不 一 定 是 合理 的 。 一 种 解 
决 办 法 是 ， 用 价格 条 形 图 上 方 的 图 标 来 表示 该 车 在 条 形 图 中 的 位 置 。 为 了 用 同样 的 方式 标示 出 
所 有 汽车 ， 可 以 在 条 形 图 上 方 创建 一 个 如 图 2-4 所 示 的 “对 象 向 量 ”(object vector)。 对 象 向 
量 同样 可 以 立即 显示 出 每 个 价格 段 中 的 汽车 数量 分 布 。 为 了 便于 对 比 ， 对 象 向 量 中 的 图 标 通常 
按 价格 排序 S。 汽 车 图 片 (图 2-3) 和 对 应 价格 范围 (图 2-4) 之 间 的 关系 (relation) 可 以 通过 
它们 之 间 的 连 线 来 表示 。 但 是 ， 一 种 更 有 效 的 方法 是 使 用 颜色 编码 :在 图 片上 加 上 一 个 颜色 边 
框 (图 2-5)， 然 后 使 用 相同 的 颜色 来 标注 对 应 的 图 标 。 这 样 ， 图 片 和 价格 之 间 的 关系 就 变 得 清 
晰 且 易 于 记忆 ， 从 而 扩展 了 用 户 对 这 些 汽车 的 心理 模型 。 


O 图 标 之 间 的 相等 距离 无 法 表示 出 精确 的 价格 差别 。 
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图 2-3 汽车 的 一 个 (难以 量化 的 ) 属性 ， 它 的 外 观 可 能 会 完全 吸引 购买 者 的 注意 力 
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图 2-4 条 形 图 上 方 的 图 标 表示 对 应 的 汽车 
© © ®©® © @ © © © © © 
i er — 


3 bis A 
phic 7 | .| = F: 
4 z ae a j > Ce ~ 
waan Me s i laas Bs 
l n 


图 2-5 通过 图 片 选 定 一 辆 汽车 ， 它 的 价格 通过 图 片 和 条 形 图 上 对 应 图 标的 颜色 编码 得 以 体现 ( 见 彩 图 ) 





2.7 总 图 


本 节 将 进一步 讨论 在 2.5 节 中 介绍 过 的 总 图 (overview) 的 概念 。 虽 然 很 难 对 总 图 进行 精 
确 的 定义 ， 但 一 般 可 以 将 其 视 为 对 数据 的 某 一 方面 的 量化 认 知 ， 这 一 认 知 应 能 迅速 或 下 意识 地 
( 即 不 需要 耗费 认 知 成 本 (cognitive effort) Hh) 获得 。 例 如 ， 对 可 选 汽车 数量 (“大概 20 辆 ” 
或 “值得 一 看 的 ") 或 价格 范围 “大概 10 ~20 万 ") 的 估计 。 虽 然 总 图 不 一 定 对 应 于 整个 数据 
集 ， 但 总 图 对 应 的 数据 越 多 ， 该 描述 方法 就 越 有 用 。 从 总 图 中 可 以 得 到 很 多 有 用 的 信息 ， 比 如 
数据 集 的 分 布 (“多 数 车 都 太 贵 了 ”") 和 突出 特点 (“这 些 车 要 么 太 贵 ， 要 么 太 便 宜 ， 没 有 中 间 
价位 的 ")。 还 有 一 些 信息 可 以 用 于 识别 需要 过 滤 的 部 分 数据 以 便 更 有 效 地 完成 任务 (Cairns 
and Craft, 2005), 


2.8 多 属性 


价格 并 不 总 是 购买 汽车 的 唯一 标准 。 如 果 考 虑 到 每 加 仑 公里 数 (MPG) ， 可 以 在 价格 条 形 
图 上 方 再 显示 一 个 MPG 条 形 图 ( 见 图 2-6)， 并 且 也 可 以 在 新 的 条 形 图 上 加 上 一 组 对 象 向 量 。 
两 个 条 形 图 上 方 的 图 标 数量 是 一 样 的 ， 但 图 标的 顺序 可 能 不 一 致 。 当 鼠标 点 击 或 悬 停 在 某 一 幅 
图 片上 时 ， 两 个 条 形 图 上 方 对 应 的 图 标 都 会 呈现 同样 的 颜色 编码 ， 这 样 就 有 效 地 将 图 片 和 两 个 
属性 联系 (relating) 起 来 了 ， 用 户 也 能 得 到 更 多 的 细节 (detail) 信息 。 
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图 2-6 对 应 图 标的 颜色 编码 显示 了 选中 汽车 在 各 个 条 形 图 中 的 位 置 ( 见 彩 图 ) 
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2.9 细节 


和 总 图 相 比 ， 细 节 (detail) 一 词 对 应 于 对 象 多 个 不 同属 性 的 聚合 。 细 节 的 察觉 需要 耗费 
用 户 的 认 知 成 本 。 除 非 支持 快速 认 知 的 数据 编码 设计 完美 ， 否 则 细节 信息 的 察觉 通常 不 会 是 一 
个 快速 过 程 。 一 辆 汽车 的 可 能 细节 是 “12 万 ， 低 MPG， 强 力 推荐 的 ，1990 年 生产 的 别克 牌 ， 
比 买 Chevy 划 算 ”。 细 节 不 强制 要 求 精度 。 

由 于 信息 可 视 化 的 定义 中 显示 其 主要 目的 是 为 数据 创建 心理 模型 ， 因 此 总 图 不 需要 始终 出 
现在 细节 认 知 之 前 (Shneiderman, 1996)。 例 如 ， 消 费 者 可 能 首先 选择 一 辆 汽车 ， 通 过 查看 价 
格 、MPG、 车 龄 、 马 力 等 细节 来 了 解 该 类 汽车 的 性 能 。 又 如 一 个 购房 者 如 果 对 所 在 国家 或 地 
区 不 熟悉 ， 他 可 能 会 任意 地 查看 一 栋 房 子 的 卡片 来 获得 对 该 地 区 房产 的 初步 印象 。 该 行为 如 同 
“平面 ”上 的 一 “点 ”"， 可 以 作为 构建 心理 模型 的 出 发 点 ， 可 能 的 后 续 操作 是 获取 更 多 的 细节 或 
总 图 。 


2.10 显著 对 象 


对 象 间 不 同 关系 的 显示 有 助 于 消费 者 的 决策 判断 。 消 费 者 的 心目 中 通常 有 一 辆 理想 的 汽车 。 
虽然 当前 可 能 没有 这 辆 车 ， 但 还 是 可 以 用 同样 的 方式 将 这 辆 理想 汽车 (图 2-7) 描述 出 来 。 为 
了 避免 混 消 ， 应 该 使 用 一 个 特别 的 图 标 以 示 区 分 。 这 样 ， 所 有 可 选 汽车 和 理想 汽车 之 间 的 关系 
就 可 以 得 到 视觉 呈现 。 可 选 汽车 图 标 和 理想 汽车 图 标 之 间 的 距离 代表 了 它们 和 理想 汽车 之 间 的 
差异 。 同 样 的 ， 一 辆 汽车 可 以 成 为 “ 备 选项 ”并 得 到 某 种 形式 的 标注 (图 2-8) ， 从 而 减低 存储 
该 信息 的 需求 。 
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图 2-7 条 形 图 上 的 图 标 可 以 表示 一 辆 理想 (但 可 图 2-8 可 以 对 列 人 考虑 范围 的 汽车 加 以 “标注 "， 
能 不 存在 ) 的 汽车 。 该 图 标 可 作为 参考 标 以 供 进一步 考察 ( 见 彩 图 ) 
HE ( 见 彩 图 ) 


2.11 交互 式 属 性 选择 


相对 于 通过 识别 图 片 来 获取 汽车 细节 ， 消 费 者 可 能 更 倾向 于 在 价格 条 形 图 上 选择 一 个 合适 
的 范围 来 进行 价格 筛选 (图 2-9)。 当 用 户 选择 了 一 个 价格 范围 后 ,该 范围 内 的 图 标 会 得 到 高 显 ， 
对 应 的 图 片 也 会 加 上 一 个 同色 边框 。 不 需要 进一步 的 交互 ， 对 应 的 MPG 条 形 图 上 的 图 标 就 能 
显示 这 些 汽车 的 MPG 属 性 值 。 通 过 这 样 一 个 聚焦 (focusing) 操作 ， 消 费 者 可 以 实现 “在 这 个 
可 接受 的 价格 范围 内 进行 进一步 考察 ”的 活动 。 

当 符合 条 件 的 汽车 有 多 辆 时 ， 无 法 分 辨 条 形 图 上 方 的 每 个 高 显 图 标 所 对 应 的 高 显 图 片 ， 我 
们 可 以 使 用 一 种 简单 而 有 效 的 技术 “ 扫 光 ”(brushing) 来 解决 这 个 问题 。 当 鼠标 悬 停 在 某 幅 
图 片上 时 ， 该 汽车 在 价格 和 MPG 对 象 向 量 上 的 对 应 图 标 将 得 到 某 种 形式 的 高 显 ， 反 之 亦 然 。 
对 MPG 范 围 的 交互 式 选择 (interactive selection， 图 2-10) 将 显示 同时 满足 价格 和 MPG 两 个 属 
性 条 件 的 汽车 。 在 浏览 数据 的 过 程 中 ， 用 户 可 以 随时 设 定 或 取消 乌 选 范围 ， 只 有 满足 所 有 属性 
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条 件 的 汽车 才 会 得 到 高 显 。 系 统 对 用 户 操作 的 实时 反应 可 以 增强 用 户 的 心理 模型 ， 帮 助 用 户 进 
行 问题 的 重 定义 。 
> eee o 
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图 2-9 对 条 形 图 范围 的 动态 选择 (本 例 中 设 价格 范 围 为 12~ 14 万 ) 显示 有 4 辆 符合 条 件 的 汽车 ( 见 彩 图 ) 
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图 2-10 交互 式 地 选择 了 MPG 范 围 后 ， 只 有 同时 满足 价格 和 MPG 条 件 的 汽车 才 会 得 到 高 显 ( 见 彩 图 ) 





2.12 空间 局 限 性 


在 消费 者 做 出 最 终 决 定 前 ， 可 能 会 对 10 个 以 上 的 属性 进行 考察 。 遗 憾 的 是 ， 这 些 条 形 图 和 
对 应 图 片 不 能 同时 显示 在 有 限 的 显示 器 屏幕 上 。 虽 然 传 统 的 翻 页 功能 (图 2-11) 是 一 种 可 能 的 
解决 办 法 ， 但 它 最 大 的 缺点 在 于 不 能 同时 查看 某 辆 汽车 的 所 有 属性 。 另 一 种 多 属性 表示 方法 是 
减少 大 多 数 条 形 图 的 高 度 ， 抑 制 范 围 标签 ， 同 时 保持 条 形 图 上 方 的 图 标 和 对 应 颜色 编码 不 变 
(图 2-12) 。 如 果 用 户主 要 关注 其 中 两 个 属性 ， 例 如 价格 和 MPG， 则 其 他 条 形 图 的 显著 变化 将 
变 得 很 醒目 。 如 果 用 户 需要 查看 其 他 非 焦点 属性 ， 可 以 通过 滚动 方式 展示 它们 的 全 视图 。 
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图 2-11 当 没 有 足够 的 空间 显示 所 有 的 条 形 图 时 ， 可 以 在 视窗 中 滚动 查看 这 些 属性 ( 见 彩 图 ) 
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图 2-12 当 没有 足够 的 空间 显示 所 有 的 条 形 图 时 ， 可 以 通过 压缩 非 焦点 条 形 图 高 度 的 方法 来 一 次 
性 地 显示 更 多 的 条 形 图 。 通 过 滚动 功能 来 决定 当前 完全 展开 的 条 形 图 ( 见 彩 图 ) 


2.13 过 滤 


对 于 消费 者 而 言 ， 过 滤 是 一 个 很 实用 的 功能 。 例 如 ， 如 果 消 费 者 只 对 价格 在 16 一 18 万 元 的 
汽车 感 兴趣 ， 可 以 通过 某 些 交 互 技 术 保证 条 形 图 中 只 呈现 符合 该 价格 条 件 的 汽车 (图 2-13)。 
这 种 过 滤 功 能 的 一 大 优势 在 于 数据 抑制 (suppression) ， 它 可 以 将 用 户 的 注意 力 集中 在 某 个 数 
据 子 集 上 ， 从 而 减少 可 能 的 认 知 成 本 。 从 图 2-13 中 可 以 看 到 ， 过 让 技术 的 不 足 在 于 上 下 文 信息 





的 丢失 。 
图 2-13 如 果 用 户 只 对 某 一 价格 范围 内 的 汽车 感 兴趣 ， 可 以 压缩 掉 其 他 不 相关 的 数据 ( 见 彩 图 ) 
2.14 小 结 


我 们 讨论 以 上 这 个 汽车 购买 系统 的 目的 在 于 介绍 理解 和 研究 信息 可 视 化 所 必须 掌握 的 重要 
概念 。 到 目前 为 止 ， 我 们 已 经 讨论 了 两 个 概念 ， 数据 描述 (representation, 数据 的 视觉 或 声 觉 
编码 ) 和 数据 表示 (presentation: 在 有 限 的 时 间 和 空间 内 对 已 编码 数据 进行 选择 和 布局 ) 。 我 
们 将 在 第 3 章 和 第 4 章 对 这 两 个 概念 进行 详细 介绍 。 第 三 类 需要 讨论 的 技术 是 交互 (interaction ) 。 
它 是 最 近 15 ~ 20 年 间 信息 可 视 化 的 重要 性 得 到 迅速 肯定 的 主要 原因 。 我 们 可 以 提出 一 个 想法 
或 问题 ， 然 后 通过 即时 反应 的 交互 得 到 反馈 ， 从 而 增强 对 数据 的 理解 。 交 互 允 许 用 户 选 择 数据 
的 不 同 视图 ， 由 于 我 们 经 常 在 取得 “Ah HA!” 的 信息 启示 前 频繁 切换 于 不 同 的 视图 间 ， 因 此 
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必须 确定 在 不 同 的 视图 间 的 “定位 ”方式 (Woods and Watts, 1997), 


2.15 定位 帮助 


当 用 户 设置 了 一 定 的 属性 范围 对 数据 进行 筛选 时 ， 通 常会 有 这 样 一 个 想法 :“ 如 果 再 增加 
1000 美 元 预算 会 怎样 ? ”为 了 回答 这 类 “如 果 …… 怎样 ”的 问题 ， 可 以 选择 下 一 个 高 价位 范 
围 然后 观察 相应 的 变化 。 但 是 为 了 回答 “如 果 保 持 价格 范围 不 变 ， 降 低 MPG 值 ， 又 会 怎样 ” 
的 新 问题 ， 就 必须 重复 以 上 操作 。 事 实 上 回答 这 类 “如 果 …… 怎 样 ”的 问题 的 更 有 效 的 方法 是 
对 图 表 向 量 做 一 个 简单 的 修改 。“ 边 界 图 标 ”( 图 2-14) 是 指 不 符合 用 户 设 定 的 属性 范围 的 图 标 ， 
但 如 果 选 中 该 图 标 下 方 的 条 形 ， 该 图 标 会 立即 满足 所 有 限制 条 件 。 换 句 话 说， 边界 图 标 下 方 未 
被 选中 的 属性 范围 是 该 汽车 唯一 不 满足 的 限制 条 件 。 这 种 编码 方式 可 以 提供 敏感 度 信息 
(sensitivity information) ， 它 可 以 帮助 用 户 发 现 以 前 没有 考虑 过 的 可 能 性 ， 对 用 户 在 信息 空间 
内 的 浏览 (exploration) 非常 有 用 。EZChooser (Wittenburg et al.,2001) 是 一 个 使 用 了 敏感 度 
信息 的 信息 可 视 化 工具 ( 见 图 2-15)， 它 是 本 章 中 大 多 数 例子 的 灵感 来 源 。 
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图 2-14 条 形 图 上 方 的 “边界 ”图 标 表示 该 属性 范围 是 该 边界 汽车 唯一 不 满足 的 条 件 。 如 果 该 属 
性 范围 被 选中 ， 这 个 图 标 也 会 相应 地 发 生 改变 以 标志 它 符合 所 有 设 定 的 属性 范围 
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图 2-15 EZChooser 视 图 ， 敏 感 信息 通过 边界 汽车 图 标 加 以 体现 。 图 片 来 源 : 感谢 Kent Wittenburg 
MI 


2.16 在 信息 空间 中 的 移动 


现代 信息 可 视 化 工具 和 Minard、Snow 及 Nightingale 等 传统 作品 最 大 的 不 同 之 处 在 于 交互 
(interaction)， 即 允许 用 户 进行 数据 视图 切换 。 以 汽车 购买 为 例 ， 前 面 图 中 记录 下 的 用 户 活动 
序列 显示 ， 购 买 者 通过 交互 查看 汽车 数据 的 不 同 视图 序列 。 整 个 过 程 是 渐进 式 的 : 用户 首先 要 
了 解 汽 车 数据 (如 建立 一 个 心理 模型 )， 然 后 逐步 形成 最 后 的 决定 。 在 这 个 过 程 中 ， 用 户 的 心 
理 模 型 可 能 发 生 显著 的 变化 ， 对 信息 启示 进行 初步 收集 ， 并 对 心理 模型 进行 增删 操作 。 视 图 间 
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的 切换 可 以 看 做 是 整个 汽车 数据 信息 空间 内 的 活动 (movement)。 

一 对 夫妇 决定 晚上 的 娱乐 项 目 可 以 看 做 是 活动 的 另 一 个 不 同 的 实例 (图 2-16)。 他 们 利用 
一 个 简单 的 菜单 系统 在 预 设 框架 内 进行 顺序 查找 。 这 和 汽车 购买 很 不 一 样 ， 汽 车 消费 者 可 以 自 
由 查看 多 个 不 同 视图 ， 并 且 和 系统 有 着 很 多 不 同 的 交互 方式 。 但 这 两 个 例子 中 由 交互 控制 的 基 
本 活动 都 是 通过 信息 空间 内 的 移动 对 数据 的 不 同 视图 进行 查看 。 





图 2-16 利用 菜单 系统 来 决定 娱乐 活动 ， 这 一 任务 由 离散 信息 空间 中 的 一 系列 移动 组 成 


信息 空间 内 的 交互 式 移动 也 叫 定位 (navigation) 。 虽 然 决定 晚上 的 娱乐 项 目 只 涉及 信息 空 
间 内 的 少数 几 个 移动 ， 但 是 其 他 类 似 于 汽车 购买 的 常见 任务 可 能 涉及 100 个 或 更 多 的 活动 。 特 
别 当 活动 涉及 很 多 步骤 时 ， 交 互 设计 师 应 重点 考虑 如 何 提供 定位 线索 (cues)。 图 2-14 和 图 2-15 
已 经 展示 了 边界 图 标的 例子 。 图 2-16 中 每 幅 图 片上 方 的 标题 也 是 一 个 实例 ， 它们 展示 了 用 户 的 
浏览 记录 ， 使 用 户 能 方便 地 回 退 到 已 访问 的 页 面 。 

考虑 到 交互 的 重要 性 ， 我 们 在 第 3 章 数据 描述 和 第 4 章 数据 表示 之 后 加 入 了 第 5 章 交 互 ， 这 
三 个 概念 组 成 了 本 书 的 核心 内 容 ， 同 时 也 是 数据 和 寻找 启示 的 用 户 之 间 的 桥梁 (图 2-17) 。 在 
深入 讨论 各 章 之 前 ， 我 们 再 次 重申 信息 可 视 化 是 对 数据 建立 心理 模型 的 过 程 。 因 此 我 们 首先 需 
要 了 解 这 些 和 信息 可 视 化 直接 相关 的 人 类 行为 。 





本 书 涵盖 范畴 


图 2-17 本 书 强调 交互 受 控 于 高 阶 认 知 过 程 
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2.17 感知 与 解释 


在 汽车 购买 一 例 中 我 们 讨论 了 可 视 化 活动 中 的 人 类 行为 。 感 知 (perception) 与 解释 
(interpretation) 是 其 中 最 本 质 的 两 种 行为 (图 2-17)。 视 觉 感 知 ， 即 观看 数据 描述 ， 发 生 在 对 
描述 (无 论 它 是 条 形 图 上 方 的 高 显 图 标 还 是 旁边 的 拖 动 栏 ) 进行 解释 之 前 。 根 据 当 前 的 普遍 理 
解 ， 在 信息 可 视 化 范围 内 对 这 些 人 类 行为 进行 研究 是 可 能 的 而 且 是 有 用 的 。 本 书 没有 编写 单独 
的 章节 来 介绍 这 些 概念 ， 而 是 把 相应 的 内 容 放 在 各 章节 的 适当 位 置 来 介绍 。 对 该 课题 的 深入 研 
究 可 以 参考 Colin Ware 所 著 的 《lnformation Visualization: Perception for Design》( 信 息 可 视 化 : 
设计 感知 ) 一 书 。 

感知 与 解释 不 是 唯一 和 信息 可 视 化 相关 的 人 类 行为 ， 还 存在 更 多 的 属于 “高 阶 认 知 过 程 ” 
(higher-order cognitive processes) 的 行为 (图 2-17)。 这 一 认 知 过 程 得 益 于 信息 可 视 化 技术 。 
例如 ， 在 信息 空间 内 所 采取 的 下 一 步 又 取决 于 用 户 当前 的 内 部 模型 、 对 问题 的 当前 描述 、 为 增 
强 模型 所 采取 的 策略 以 及 对 已 实施 行动 所 采用 的 评价 指标 。 所 有 这 些 行为 毫 无 疑问 都 受 储存 在 
用 户 长 期 记忆 中 的 历史 经 验 的 影响 。 虽 然 这 些 行为 对 交互 设计 师 非常 重要 ， 但 对 它们 的 研究 不 
如 对 感知 与 解释 的 研究 深入 ， 我 们 在 本 书 中 也 不 做 深度 探讨 。 


2.18 总 结 


本 章 通过 一 个 有 具体 例子 介绍 了 信息 可 视 化 的 基本 活动 如 过 污 、 聚 焦 等 ， 以 及 细节 和 总 图 的 
获取 。 我 们 也 看 到 了 这 些 活动 的 有 效 性 是 如 何 受 数 据 (包括 数值 和 关系 ) 的 描述 和 表示 方式 的 
影响 ， 同 时 也 体会 到 了 交互 所 带 来 的 益处 。 接 下 来 ， 第 3 章 至 第 5 章 将 分 别 讨论 信息 可 视 化 的 三 
个 最 重要 的 技术 : 数据 描述 、 数 据 表 示 以 及 交互 。 


习题 


建议 通过 课堂 讨论 的 形式 来 加 深 对 以 下 习题 的 理解 。 

2.1 (复习 题 ) 列 出 条 形 图 描述 法 的 优 缺 点 。 

2.2 (复习 题 ) 解释 EZChooser 中 出 现在 条 形 图 上 方 的 边界 图 标的 作用 。 

2.3 (复习 题 ) 比较 过 滤 和 认 焦 的 优 缺 点 。 

2.4 (复习 题 ) 一 辆 汽车 的 属性 有 价格 、 外 观 、 品 牌 、 推 荐 值 、 马 力 、 生 产 年 份 及 车 龄 。 
请 分 别 指出 其 中 属于 数值 型 、 顺 序 型 或 类 别 型 的 属性 。 

2.5 根据 你 购买 多 属性 对 象 《如 移动 电话 、 洗 衣 机 、 自 行车 或 汽车 ) 的 经 验 ， 陈 述 你 对 
“总 图 ”和 “细节 ”的 理解 并 举 出 具体 实例 。 

2.6 对 于 习题 2.4 中 提 到 的 属性 ， 哪 些 可 以 用 于 对 条 形 图 上 方 的 对 象 做 排序 ? 
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数据 描述 





我 们 在 前 面 章节 中 的 讨论 以 及 在 第 1 章 中 介绍 过 的 例子 都 显示 了 信息 可 视 化 的 强大 效力 在 
很 大 程度 上 取决 于 它 对 通常 以 数字 形式 表现 的 原始 数据 的 接受 能 力 和 以 方便 用 户 提取 信息 为 目 
标的 数据 描述 能 力 。 我 们 在 这 里 重申 Simon (1996) 的 精简 评述 

seee 解决 一 个 问题 就 意味 着 对 它 进行 描述 从 而 使 解决 方案 变 得 清晰 。 

我 们 对 “描述 ”的 定义 和 字典 定义 一 致 ; 

描述 (动词 ) : 描写 ， HA, 

我 们 已 经 看 过 了 各 种 对 数据 进行 视觉 化 描述 (也 可 以 叫做 编码 ) 的 方法 。Minard 使 用 了 颜 
色 和 不 同 粗 细 的 线条 ，John Snow 使 用 了 点 和 又 ，Florence Nightingale 使 用 了 “玫瑰 花瓣 ”， 
Harry Beck 利 用 颜色 对 地 铁 线 路 进行 了 区 分 。 还 有 很 多 对 数据 进行 视觉 化 和 听觉 化 描述 的 例子 ， 
我 们 在 这 里 无 法 一 一 枚 举 。 在 详细 探讨 各 种 技术 前 , 我 们 有 必要 了 解数 据 描述 的 三 个 重要 特性 ， 
数据 的 类 型 、 数 据 的 复杂 度 以 及 用 户 对 已 编码 数据 的 解释 方式 。 


数据 类 型 


数据 描述 的 特性 之 一 是 处 理 数据 的 两 个 或 多 个 数据 项 之 间 的 关系 (或 结构 ) 。 图 3-1 所 示 的 
汽车 购买 系统 使 用 颜色 来 突出 汽车 的 价格 和 外 观 之 间 的 关系 。 第 1 章 中 介绍 的 “地 下 伦敦 ”的 
例子 使 用 有 色 线 条 来 描述 站 台 之 间 的 连接 。 扫 光 (brushing) 等 交互 技术 有 助 于 对 关系 进行 编 
码 (Becker and Cleveland, 1987); 在 图 3-2 中 ， 鼠标 悬 停 在 某 个 医生 上 可 以 清楚 地 看 到 该 医生 
负责 的 床位 ， 反 之 亦 然 。 
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图 3-1 第 2 章 中 讨论 的 汽车 购买 系统 的 部 分 界面 : 紫色 代表 某 种 关系 ( 见 彩 图 ) 


sss 
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图 3-2 扫 光 示例 : 对 医生 的 交互 可 以 显示 该 医生 负责 的 床位 ， 反 之 亦 然 
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我 们 也 看 到 了 对 数值 进行 描述 的 需求 。 有 时 用 户 追 求 的 是 精度 ， 比如 他 想 知道 一 辆 汽车 的 
价格 是 16 995 英 镑 。 但 很 多 情况 下 用 户 感 兴趣 的 是 推导 数值 (Tweedie, 1997)， 例如 平均 值 或 
一 个 数据 范围 。 除 了 精确 回答 例如 “价格 是 多 少 ”这 样 的 问题 外 ， 我 们 还 必须 能 够 回答 像 推荐 
度 这 样 的 定性 询问 。 

本 章 将 分 别 对 数值 和 结构 这 两 类 数据 做 详细 讨论 。 


数据 复杂 度 

基于 一 两 个 属性 进行 汽车 选 购 是 简单 而 直接 的 。 如 图 3-3 所 示 ， 在 价格 和 每 加 仓 英里 数组 
成 的 二 维 空间 中 ， 可 以 使 用 散 点 图 (scatter plot) 来 表示 每 辆 车 在 该 空间 内 的 位 置 。 在 实际 应 
用 中 ， 买 家 可 能 对 多 达 10 个 以 上 的 汽车 属性 感 兴趣 ， 这 意味 着 可 视 化 工具 必须 要 能 够 对 40 辆 
汽车 (每 辆 汽车 具有 多 于 10 个 属性 ) 进行 编码 。 问 题 的 关键 在 于 维 数 或 属性 数目 ， 而 非 汽 车 数 
量 。 因 此 在 我 们 的 讨论 中 ， 我 们 将 首先 接触 单 变 量 数据 (univariate data， 只 涉及 一 个 属性 )、 
双 变 量 数 据 (bivariate data， 二 维 ) 以 及 三 变量 数据 (trivariate data) ， 最 后 讨论 最 具 挑 战 性 的 
超 变 量 数据 (hypervariate data， 通 常 也 叫 多 维 数据 ) HIRO. 





10 12 14 16 18 20 
价格 (£K) 


图 3-3 每 个 点 显示 一 辆 汽车 ， 对 应 其 价格 和 每 加 仑 英里 数 


感知 和 认 知 


我 们 在 这 里 没有 考虑 用 户 对 数据 描述 的 理解 。 我 们 在 第 2 章 中 提 到 过 ， 当 用 户 行为 和 所 讨 
论 的 技术 相关 时 ， 我 们 会 对 其 进行 介绍 。 虽 然 我 们 只 做 简要 讨论 (用 仿宋 体 标识 )， 但 是 希望 
可 以 帮助 大 家 认识 到 用 户 行为 习惯 对 交互 设计 的 影响 。 另外 , 我 们 将 讨论 特定 技术 的 评价 方法 ， 
不 会 只 单纯 地 列 出 一 些 有 用 技术 而 不 解释 为 什么 应 该 重视 它们 。 


3.1 数值 编码 
3.1.1 单 变量 数据 
1. 一 个 单独 的 数值 


要 引起 用 户 对 一 个 单独 数值 的 关注 是 很 难 的 ， 这 也 许 是 令 人 难以 置信 的 。 一 个 典型 的 例子 
是 老式 的 飞行 高 度 计 ( 见 图 3-4)。 该 装置 的 作用 是 提醒 飞行 员 飞 机 距离 海平 面 的 高 度 。 然 而 ， 
不 恰当 的 高 度 描述 方式 直接 导致 了 一 些 空难 的 发 生 。 


O 该 术语 和 教学 方法 来 源 于 Cleveland (1993), 
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图 3-4 导致 了 许多 事故 的 飞行 高 度 计 的 原始 设计 


高 度 计 表盘 上 的 三 个 指针 由 细 到 粗 分 别 表示 万 英尺 、 千 英尺 和 百 英尺 单位 。 这 种 常见 的 指 
针 描 述 方式 使 用 户 可 以 很 快速 地 从 图 3-4 中 读 出 当前 高 度 为 13 460 英 尺 。 但 是 ， 当 飞行 员 的 目 
光 从 高 度 计 上 移 开 去 读 取 另 一 个 表盘 数据 、 观察 窗外 情况 或 和 副 驾 驶 员 交 谈 时 , 问题 就 出 现 了 : 
当 驾 驶 员 的 目光 再 次 回 到 高 度 计 时 ， 很 可 能 会 忽略 高 度 的 微小 变化 。 例 如 ， 图 3-5 和 图 3-6 中 显 
示 的 是 不 同 的 高 度 ， 但 由 于 差异 微小 ， 所 以 第 一 眼看 起 来 可 能 是 一 样 的 。 然 而 它们 之 间 的 高 度 
差 有 1 万 英尺 之 多 。 这 就 是 我 们 在 第 1 章 中 介绍 过 的 变化 盲 视 (Rensink, 2002) ， 这 种 现象 和 信 
息 可 视 化 是 息息相关 的 。 例 如 ， 如 果 我 们 期 望 用 户 能 通过 视觉 方式 注意 到 一 些 交互 的 发 生 ， 就 
必须 保证 这 些 变化 能 被 用 户 所 注意 到 。 又 如 ， 图 3-7 和 图 3-8 是 不 一 样 的， 但 读者 第 一 眼 可 能 看 
不 出 差别 。 


图 3-5 高 度 描述 图 3-6 很 可 能 被 误 读 为 和 图 3-5 中 一 样 高 度 的 视图 





a SNE 


图 3-7 不 同 于 图 3-8 的 一 幅 图 片 (图 片 感谢 Ron ”图 3-8 不 同 于 图 3-7 的 一 幅 图 片 (图 片 感谢 Ron 
Rensink 惠 允 ) Rensink 惠 允 ) 
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根据 用 户 也 就 是 飞行 员 的 使 用 习惯 ， 现 代 的 飞机 高 度 计 做 了 如 下 改进 〈 如 图 3-9 所 示 ): 由 
于 飞行 员 需 要 对 潜在 危险 做 出 迅速 判断 ， 因 此 现代 飞机 高 度 仪 将 高 度 分 为 两 个 部 分 ， 分 别 用 绿 
色 和 紫色 标明 。 飞 机 的 当前 高 度 用 一 个 黑色 的 指针 表示 (前 一 个 数字 表示 百 英 尺 量 级 上 的 高 度 ， 
后 一 个 数字 表示 十 英尺 和 英尺 量 级 上 的 高 度 ) 。 因 此 ， 只 需 快 速 地 扫 一 眼 (最 多 200 毫 秒 ) 就 
能 确定 飞机 当前 处 于 安全 飞行 高 度 。 如 果 需 要 细节 信息 ， 可 以 从 黑色 指针 的 位 置 读 出 当前 高 度 
位 于 1600 和 2000 英 尺 之 间 。 如 还 需要 更 多 的 细节 (例如 降落 时 )， 可 以 从 黑色 指针 内 读 出 精确 
的 当前 高 度 。 另 外 ， 十 英尺 和 英尺 量 级 上 的 高 度 表示 为 黑色 指针 内 的 后 两 个 数字 (而 非 两 个 单 
独 的 指示 器 )。 它 可 以 帮助 飞行 员 判 断 飞 机 是 在 上 升 还 是 下 降 。 需 要 再 次 指出 的 是 ， 可 视 化 技 
术 的 使 用 必须 和 应 用 环境 相 结 合 。 例 如 ， 由 于 飞行 员 更 关心 百 英 尺 量 级 上 的 变化 ， 因 此 黑色 指 
针 内 前 一 个 数字 比 后 两 个 数字 大 。 对 各 个 量 级 的 高 度 值 使 用 相同 大 小 的 显示 会 降低 高 度 计 的 价 
值 ， 这 只 能 说 明 设计 者 没有 真正 理解 应 用 环境 。 





图 3-9 现代 飞行 高 度 计 ( 见 彩 图 ) 


单独 数值 表示 的 重要 性 还 可 以 体现 在 外 科 手 术 特 别 是 持续 时 间 长 达 数 小 时 的 手术 中 。 麻 醉 
m (以 及 病人 ) 需要 随时 了 解 血 压 等 重要 的 人 体 生理 信和 号 的 变化 ， 这 类 信号 的 任何 变化 都 必须 
马上 被 捕 提 到 。 图 3-10 所 示 的 系统 为 麻醉 师 提供 了 丰富 的 视觉 信息 ， 但 在 长 达 数 小 时 的 过 程 中 
对 这 些 数 据 做 监测 需要 耗费 大 量 精力 。 最 简单 的 解决 方法 是 对 重要 信号 做 声 觉 编码 (Watson 
et al., 1999; Watson and Sanderson, 2004) : 无 论 麻醉 师 当 前 在 做 什么 (例如 接听 病房 打 来 的 病 
情 询 问 电 话 ) ， 他 都 能 通过 音调 变化 或 一 串 连续 的 “ 哪 嘟 ” 声 意识 到 生理 信和 号 的 变化 。 通 过 这 
个 例子 ， 我 们 想 指出 可 视 化 涉及 的 “视觉 ”一 词 不 应 被 错误 地 理解 和 局 限 为 视觉 ， 信 号 也 可 以 
通过 视觉 以 外 的 其 他 方式 进行 编码 。 

2. 一 组 数值 

单独 数值 (例如 高 度 计 ) 的 显示 是 很 重要 的 ， 但 是 在 更 多 的 实际 应 用 中 需要 处 理 一 组 单 变 
量 数据 对 象 。 虽 然 已 有 很 成 熟 的 技术 (Cleveland, 1994; Tufte, 1983) ， 但 是 在 信息 可 视 化 领域 
还 是 不 断 有 新 技术 涌现 。 

图 3-11 中 多 辆 汽车 的 价格 显示 为 线性 刻度 上 的 一 组 点 。 但 是 这 个 描述 有 多 有 效 呢 ? 该 描述 
显示 了 汽车 价格 的 总 分 布 图 通过 仔细 查看 可 以 比较 精确 地 推测 出 平均 价格 从 而 判断 是 否 负 担 
得 起 ; 更 仔细 地 查看 可 以 读 出 最 高 和 最 低 价格 。 因 此 任何 数据 描述 都 应 回答 同样 一 个 问题 ， 
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“如 何 使 用 这 个 描述 ? ”汽车 购买 者 很 多 初始 的 问题 可 以 通过 箱 形 图 (Tukey Box Plot) 找到 答 
案 ( 见 图 3-12)。 箱 子 中 间 的 线条 表示 中 值 〈 将 所 有 数值 一 分 为 二 )， 箱子 的 两 端 分 别 表示 25% 
( 即 25% 的 数据 小 于 这 个 标志 值 ) 和 75% 标 志 位 。 类 似 地 ， 5% 和 95% 标 志 位 分 别 表示 为 箱子 两 
端的 两 条 平行 线 ， 奇 异 值 表示 为 点 。 大 多 数 的 数值 通过 这 种 方式 得 到 了 聚合 。 很 多 类 似 的 应 用 
常常 不 需要 精确 细节 ， 而 我 们 描述 的 是 导出 数值 。 





图 3-10 手术 过 程 中 对 病人 重要 生理 信号 的 描述 。 在 长 时 间 手 术 过 程 中 对 大 量 数 据 进行 监测 的 困难 
性 导致 声学 编码 的 引入 : 用 一 组 重复 的 “ 嘟 哪 ” 声 表示 信号 的 变化 。 无 论 麻醉 师 是 否 注 视 显 
示 有 屏幕， 都 能 通过 声音 立即 意识 到 信号 的 变化 (图 片 感谢 Marcus Watson 惠 人 允 ) ( 见 彩 图 ) 


60 60 
50 t 
trie 50 价格 
(£k) (£k) 
40 40 
: 30 
30 i 
3 
20 ° 20 
i 
$ 
wH ’ 10 
图 3-11 每 个 点 表示 一 辆 汽车 的 价格 图 3-12 用 箱 形 图 来 表示 和 图 3-11 相 同 的 一 组 数据 


直方 图 是 单 变 量 数 据 的 另 一 个 常见 的 描述 法 〈 见 图 3-13)。 目 前 ， 已 有 很 多 研究 致力 于 条 
形 大 小 的 选择 ， 我 们 在 这 里 不 进行 详 述 。 需 要 指出 的 是 ， 同 Tukey 箱 形 图 类 似 ， 直 方 图 描述 的 
也 是 又 合 属性 〈 即 导出 数值 ) ， 它 既 支持 对 总 图 的 快速 获取 ， 也 能 提供 精确 的 信息 。 直 方 图 是 
强调 数值 型 数据 导出 数值 的 众多 技术 中 的 一 种 。 例 如 ， 将 每 个 数值 范围 内 的 条 形 整 合 起 来 可 以 
得 到 第 2 章 中 介绍 过 的 条 形 图 ( 见 图 3-14): 每 个 条 形 代 表 的 对 象 数量 对 应 于 条 形 的 宽度 ， 虽 然 
数据 的 一 些 特点 (如 奇异 值 的 存在 ) 或 某 个 数值 段 的 空缺 在 条 形 图 中 不 能 轻易 地 被 一 眼看 出 ， 
但 在 某 些 应 用 中 这 些 缺 失 是 可 以 容忍 的 。 
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这 里 的 数据 不 一 定 是 数值 型 的 ， 也 可 以 是 类 别 型 或 顺序 型 的 。 汽 车 品牌 如 福特 、 尼 业 、 丰 
田 、 法 拉 利 等 单 变量 类 别 型 数据 可 以 在 在 线 汽车 销售 系统 如 EZChooser (Wittenburg et al., 
2001) 中 表示 为 条 形 图 ( 见 图 3-15)。 图 3-16 是 顺序 型 数据 在 一 个 商店 周 销售 量 描述 中 的 应 用 。 
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图 3-13 单 变量 数据 的 直方 图 描述 
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图 3-14 通过 将 直方 图 中 各 个 条 形 整合 并 横向 放置 ， 忽 略 所 有 空缺 数值 段 ， 可 以 得 到 单 变量 数据 的 条 形 图 描述 
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图 3-15 单 变量 类 别 型 数据 的 条 形 图 描述 
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图 3-16 单 变量 顺序 型 数据 的 直方 图 描述 


3.1.2 双 变 量 数据 


散 点 图 是 双 变量 数据 的 传统 描述 法 。 以 购买 住房 为 例 ， 假 设 每 栋 住房 都 有 价格 和 房间 数 两 
个 属性 ， 则 散 点 图 的 横 、 纵 坐标 分 别 表 示 这 两 个 属性 ， 每 栋 住房 表示 为 这 个 二 维 空间 中 的 一 个 
点 〈《 见 图 3-17)。 散 点 图 描述 了 数据 的 基本 走向 〈 例 如 ， 价 格 越 高 则 房间 数 越 多 ) ， 有 助 于 用 户 
的 决策 权衡 (例如 想 以 较 低 价格 购买 一 栋 房 间 数 较 多 的 住房 )， 也 有 利于 发 现 意外 收获 (例如 
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发 现 一 栋 价值 11 万 英镑 的 有 5 个 房间 的 住房 ) 。 而 任何 一 个 传统 的 需要 输入 精确 查询 条 件 的 查询 
系统 都 不 能 鼓励 这 样 的 意外 收获 ， 这 也 是 信息 可 视 化 得 到 广泛 应 用 的 原因 之 一 。 
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图 3-17 双 变量 数据 的 散 点 图 。 每 个 点 表示 一 栋 住 房 的 价格 和 房间 数 


时 间 序 列 是 散 点 图 的 一 个 特例 : 通常 一 个 坐标 表示 时 间 ， 另 一 个 坐标 表示 和 时 间 相 关 的 函 
数 。 在 医学 和 气象 研究 等 领域 中 已 有 许多 数据 描述 技术 和 可 视 化 工具 ， 它 们 可 以 帮助 用 户 从 一 
系列 与 时 间 相 关 的 数据 中 提取 出 有 用 信息 。 图 3-18 描 述 了 一 个 与 时 间 相 关 的 数据 集 ， 它 显示 了 
1430 支 股票 在 52 周 内 的 价格 波动 (Hochheiser and Shneiderman, 2004) 。 图 3-18a 显 示 了 整个 数 
据 集 的 总 图 ,体现 了 该 数据 集 的 密度 和 分 布 。 图 3-18b 中 的 时 间 盒 凸显 了 在 第 1 天 到 第 4 天 之 间 
价格 在 70~250 美 元 的 股票 。 图 3-18c 中 加 入 了 一 些 约束 条 件 ， 选 中 了 在 第 7 天 到 第 12 天 之 间 价 
格 在 70~ 95 美 元 的 股票 ， 图 3-18d 选 中 了 在 第 15 天 到 第 18 天 之 间 价 格 在 90~ 115 美 元 的 股票 。 


28432 





图 3-18 一 个 基于 时 间 的 查询 工具 的 4 个 视图 。a) 整个 数据 集 的 总 图 ，b) 时 间 盒 凸显 了 在 第 1 天 
到 第 4 天 之 间 价格 在 70 一 250 美 元 的 股票 ，c) 加 入 一 个 价格 约束 条 件 ， 选 中 在 第 7 天 到 第 


12 天 之 间 价 格 在 70 一 95 美 元 的 股票 ，d) 另 一 个 价格 约束 条 件 选中 在 第 15 天 到 第 18 天 之 间 
价格 在 90 ~ 115 美 元 的 股票 
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图 3-19 是 时 间 序列 的 另 一 种 描述 方式 ， 有 助 于 从 数据 中 提取 简单 的 整体 印象 。 它 显示 了 10 
年 来 洛杉矶 上 空 的 臭氧 浓度 ， 每 个 小 方块 代表 一 天 ， 颜 色 表 示 臭 氧 浓度 。 从 图 中 可 以 看 到 ， 夏 
季 的 臭氧 浓度 普遍 比 冬季 高 ， 但 总 体 来 看 有 逐年 降低 的 趋势 。 
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图 3-19 10 年 来 洛杉矶 上 空 的 臭氧 浓度 ( 见 彩 图 ) 


将 双 变 量 数据 的 两 个 属性 做 完全 分 隔 将 带 来 意 想不到 的 好 处 。 例 如 ， 图 3-20a 将 两 个 属性 
分 别 表示 为 一 个 单独 的 直方 图 。 每 栋 住 房 在 每 个 直方 图 中 出 现 一 次 ， 如 图 3-20b 中 的 高 显 所 示 。 
但 如 果 直 方 图 是 静态 的 ， 则 没有 机 会 查看 两 个 属性 间 的 关系 ， 也 就 没有 必要 使 用 两 个 单独 的 直 
方 图 。 如 果 允 许 利用 交互 来 设置 某 个 属性 的 限定 范围 ( 见 图 3-20c)， 则 符合 条 件 的 住房 可 以 在 
两 个 直方 图 中 同时 得 到 高 显 ， 从 而 清晰 地 展示 两 个 属性 间 的 关系 。 这 里 我 们 再 一 次 看 到 了 强大 
的 扫 光 技术 ， 它 的 价值 很 难 不 被 夸大 。 特 别 是 当选 中 对 象 被 重 排 到 直方 图 底部 时 (如 图 3-20d 
所 示 )， 如 果 能 将 选中 的 某 属 性 范围 在 整个 属性 范围 内 来 回 移动 ， 并 观察 选中 住房 在 第 二 个 属 
性 范围 内 的 变化 ， 则 扫 光 技术 将 带 来 额外 的 好 处 。 如 果 可 以 独立 修改 各 个 属性 范围 的 上 下 限 ， 
则 将 形成 一 个 灵活 的 探索 式 的 可 视 化 工具 (Tweedie et al., 1994; Spence and Tweedie, 1998; 
Albinsson et al., 2003), 

实际 应 用 中 一 个 属性 可 能 比 另 一 个 属性 更 重要 或 必须 首先 查看 。 在 这 种 情况 下 就 需要 用 到 
“逻辑 ”缩放 (logical zoom) 或 “语义 ”缩放 (semantic zoom) 。 例 如 ， 如 果 价 格 是 最 受 关注 
的 因素 ， 则 汽车 购买 者 应 首先 看 到 如 图 3-21a 所 示 的 数据 描述 。 在 此 之 上 添加 语义 缩放 功能 ， 
显示 部 分 感 兴趣 汽车 的 品牌 ( 见 图 3-21b) 。 这 种 技术 至 少 可 以 追溯 到 1980 年 (Herot, 1980; 
Herot et al., 1981) ， 它 可 以 包含 多 个 属性 以 及 多 层次 的 渐进 式 缩放 。 我 们 将 在 第 4 章 中 详细 讨 
论 该 技术 。 
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图 3-20 关联 直方 图 。a) 每 株 住房 的 价格 和 房间 数 分 别 显示 在 两 个 单独 的 直方 图 中 ，b) 每 栋 住 
房 在 各 个 直方 图 中 只 出 现 一 次 c) 价格 属性 范围 的 上 下 限定 义 了 一 个 数据 子 集 ， 其 在 两 
个 直方 图 中 均 高 显 为 黑色 ，d) 符合 选 定 属性 范围 的 住房 在 直方 图 中 位 置 的 自动 调整 可 以 
增强 用 户 理解 。 这 种 方法 在 属性 范围 有 动态 变化 的 情况 下 将 非常 有 用 





b) 
图 3-21 语义 缩放 显示 了 选中 对 象 的 第 二 个 属性 
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图 3-22 所 示 的 数据 描述 反映 了 对 数据 定性 理解 的 需求 。 在 电路 设计 工业 中 ， 设 计 师 经 常 需 
要 对 所 设计 电路 的 特定 性 质 进行 查看 ， 例 如 电路 中 每 一 点 的 电压 值 。 在 图 3-22 中 这 些 电压 值 反 
映 为 黑色 方块 的 大 小 。 为 什么 这 样 表示 ?由 于 设计 者 在 头脑 中 已 经 对 该 电路 的 期 待 电压 值 有 了 
一 个 心理 模型 ， 因 此 此 种 描述 方法 可 以 确认 这 个 心理 模型 ， 或 是 如 图 3-22 所 示 的 情况 ， 清 楚 地 
表明 某 些 元 件 的 电压 值 有 误 (右上 和 角 的 两 个 部 件 的 电压 方块 大 小 不 一 )。 在 这 个 例子 中 ， 两 个 
黑色 方块 的 大 小 差异 “醒目 ”， 因 此 用 户 可 以 得 出 有 用 的 发 现 。 如 果 用 数值 表示 电压 值 ， 用 户 
可 能 就 不 太 容易 发 现 这 个 错误 。 当 用 户 需要 查看 具体 的 电压 值 时 ， 可 以 通过 鼠标 点 击 或 鼠标 悬 
停 将 黑色 方块 替换 为 数值 。 





图 3-22 每 个 黑色 方块 的 大 小 代表 电路 中 相应 点 的 电压 值 


放大 编码 是 帮助 定性 理解 的 另 一 种 技术 。 大 家 对 地 图 上 的 澳大利亚 和 新 西 兰 都 有 心理 模型 
(图 3-23)， 但 是 在 表示 自行 车 拥有 量 的 图 3-24 中 ， 新 西 兰 的 面积 是 澳大利亚 的 10 倍 ， 由 此 可 以 
推断 新 西 兰 的 自行 车 拥有 量 是 澳大利亚 的 10 们 (假设 这 是 真 的 )。 这 样 的 放大 编码 有 助 于 发 现 
有 用 信息 。 图 3-25 是 一 幅 世 界 人 口 密度 地 图 (Smith, 1999); 虽然 加 拿 大 和 澳大利亚 面积 宽广 ， 
但 由 于 人 口 稀少 ， 因 此 在 图 3-25 中 被 一 条 细小 的 线条 所 替代 。 


图 3-23 传统 地 图 上 的 澳大利亚 和 新 西 兰 
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全 
图 3-24 新 描述 中 澳大利亚 和 新 西 兰 的 大 小 说 明 新 西 兰 的 某 些 属 性 是 澳大利亚 的 10 倍 
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图 3-25 世界 人 口 密 度 图 。 放 大 编码 的 引入 为 读者 提供 了 世界 人 口 密 度 的 总 体 印象 。 当 和 传统 地 
图 比较 时 ， 请 注意 加 拿 大 和 澳大利亚 缩小 了 的 尺寸 (来源: Smith, 1999) 


3.1.3 三 变量 数据 


由 于 我 们 生活 在 一 个 三 维 的 空间 内 ， 因 此 我 们 很 自然 地 会 想 用 三 维 空间 内 的 点 来 描述 对 象 
的 三 个 属性 ， 然 后 用 一 个 二 维 视 图 对 其 进行 查看 ( 见 图 3-26)。 但 是 问题 随 之 而 来 : 例如 ， 我 
们 无 法 从 图 中 得 知 住房 A 的 价格 是 否 比 住房 C 高 。 
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价格 


房间 数 





通勤 时 间 
图 3-26 在 三 维 描述 中 无 法 对 价格 、 房 间 数 和 通勤 时 间 等 属性 进行 比较 


1. 散 点 图 矩阵 
一 种 解决 方法 是 引入 交互 ， 允 许 用 户 对 三 维 描述 做 重 排 。 例 如 ， 在 如 图 3-27 所 示 的 重 排 图 


中 可 以 很 清晰 地 看 到 住房 A 比 住房 C 便 宜 。 


房间 数 





图 3-27 对 图 3-26 中 的 数据 做 投影 以 方便 对 价格 和 房间 数 进行 比较 ( 见 彩 图 ) 


这 刚好 印证 了 那 名 有 名 的 评论 “要 想 使 三 维 描述 有 用 ， 就 必须 保证 它 能 被 移动 ”。 

对 于 三 变量 数据 以 及 后 面 将 讨论 的 超 变量 数据 ， 可 以 将 三 维 描述 的 三 个 可 能 的 二 维 投影 系 
统 地 组 织 起 来 ， 形 成 一 个 如 图 3-28 所 示 的 散 点 图 矩阵 : 从 本 质 上 来 讲 ， 相 当 于 用 户 对 三 维 描述 
做 了 三 种 不 同 的 重 排 。 虽 然 现 在 可 以 对 两 栋 住 房 进行 比较 了 ， 但 是 另 一 个 问题 又 出 现 了 。 现 在 
各 个 图 里 的 点 的 总 数 是 实际 住房 数量 的 三 倍 ， 这 间接 增加 了 用 户 的 认 知 成 本 ， 并 且 在 点 数 很 多 
的 情况 下 ， 没 有 足够 的 空间 来 显示 标签 。 交 互 可 以 允许 用 户 在 价格 -时 间 平 面 发 现 低 价 住房 ， 
相同 的 住房 可 以 同时 在 其 他 两 个 平面 内 得 到 高 显 ( 见 图 3-29)。 我 们 在 这 里 又 再 次 用 到 了 扫 光 。 
考虑 到 变化 盲 视 ， 我 们 必须 确保 用 户 能 注意 到 高 显效 果 。 因 此 ， 相 对 于 简单 地 在 三 个 散 点 图 中 
将 一 个 小 点 的 颜色 从 黑 变 成 红 ， 我们 可 以 结合 放大 和 改变 颜色 来 显示 高 显效 果 ( 见 图 3-29)。 
即使 这 种 效果 是 暂时 的 ， 它 也 可 以 有 效 地 凸显 当前 焦点 在 各 个 空间 内 的 分 布 。 

通过 以 上 例子 我 们 可 以 看 到 散 点 图 矩阵 是 描述 三 变量 数据 的 有 效 方法 ， 但 并 非 唯一 途径 。 
以 产品 故障 数据 为 例 ， 几 乎 所 有 大 规模 生产 线 都 会 遇 到 各 种 故障 。 例 如 ， 汽 车 车 载 电 台 的 故障 

告 很 容易 记录 ， 但 要 想 在 缺少 故障 产品 的 情况 下 找到 故障 原因 会 花费 昂贵 的 代价 。 图 3-30 所 
示 的 信息 可 视 化 工具 可 以 帮助 诊断 原因 : 两 个 属性 分 别 表 示 产 品 生产 日 期 和 无 故障 运行 月 份 数 
等 两 个 自 变 量 。 每 个 圆 的 大 小 表示 在 某 个 特定 月 份 生产 并 已 无 故障 运行 了 特定 月 份 数 的 产品 数 
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量 。 这 种 描述 方法 有 助 于 故障 诊断 。 例 如 ， 如 果 某 个 月 内 出 现 了 大 量 故障 ， 而 又 与 产品 无 故障 
运行 月 份 数 无 关 〈 见 图 3-30) ， 那 么 这 些 故障 叫做 “传染 性 故障 "， 产 品 经 理应 该 对 这 个 月 份 的 
产品 进行 仔细 分 析 。 如 果 很 多 故障 发 生 在 斜 对 角 线 位 置 ， 这 说 明 故 障 发 生 在 同样 时 段 内 ， 从 而 
暗示 了 季节 性 影响 的 可 能 性 。 


价格 





通勤 时 间 






通勤 时 间 


房间 数 





通勤 时 间 


通勤 时 间 


房间 数 


同 图 3-22 电 路 设计 例子 类 似 ， 还 有 另 一 种 对 三 变量 数据 的 描述 方法 。 图 3-31 显 示 的 电路 图 
中 加 入 了 一 些 圆 ， 这 些 圆 反映 了 相应 部 件 对 整个 电路 性 能 的 影响 力 。 如 果 这 个 电路 是 高 保 真 放 
大 器 ， 设 计 师 需 要 了 解 这 些 参数 在 不 同 频率 下 的 变化 情况 。 动 画 是 一 个 最 简单 的 解决 办 法 ， 例 
如 用 户 可 以 不 断 拖 动 右边 的 滑 块 来 改变 频率 ， 圆 的 大 小 会 随 之 产生 相应 的 变化 。 

地 图 是 三 变量 数据 描述 的 一 个 特殊 类 别 。 地 图 上 显示 了 位 置信 息 (经 度 和 纬度 ) 以 及 一 些 
对 象 的 值 或 属性 。 图 3-32 显 示 了 英格兰 、 苏 格 兰 和 威尔士 的 主要 大 城市 的 人 口 。 圆 的 大 小 代表 
每 个 城市 的 人 口 ， 因 此 我 们 可 以 很 快 判断 出 人 口 的 基本 分 布 情况 。 我 们 可 以 说 这 幅 图 传达 的 信 
息 是 醒目 的 。 我 们 不 需要 通过 查看 具体 数字 来 判明 人 口 最 多 的 城市 或 各 城市 的 相对 人 口 数 。 因 
此 ， 相 对 于 花费 大 量 用 户 认 知 的 工具 ， 对 用 户 感 兴趣 的 信息 进行 醒目 描述 将 有 效 地 帮助 用 户 提 
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取出 有 用 信息 。 支 持 快 速 理解 的 数据 编码 和 人 类 的 视觉 系统 紧密 相连 ， 我 们 接 下 来 将 对 其 做 详 
细 讨 论 。 
July '97 
Sept '97 


Nov '97 


月 产量 Jan '98 
(MOP) 


Mar '98 


May '98 





无 故障 运行 月 份 数 (MIS) 
图 3-30 对 产品 故障 报告 的 描述 ， 基 于 月 产量 (MOP) 和 无 故障 运行 月 份 数 (MIS ) 。 每 个 圆 的 大 
小 表示 给 定 MOP 和 MIS 值 对 应 的 故障 数 


三 倍 基 值 


基 值 


图 3-31 圆 代表 每 个 部 件 对 电路 总 体 性 能 的 影响 力 。 在 基 值 和 三 倍 基 值 之 间 变 化 的 频率 将 导致 贺 
的 大 小 发 生 相 应 的 变化 





图 3-32 英格兰 、 苏 格 兰 和 威尔士 的 主要 城市 的 人 口 描述 图 ， 圆 的 大 小 和 每 个 城市 的 人 口 成 正比 
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2. 下 意识 处 理 (pre-attentive processing): 今 事 物 变 得 醒目 

我 们 已 经 反复 提 到 了 无 须 仔细 审查 而 令 信息 变 得 醒目 这 一 需求 。 正 如 Colin Ware (2004) 
FEM. “我 们 可 以 对 符号 做 一 些 处 理 ， 使 它们 即使 是 短暂 一 普 也 能 被 视觉 化 地 识别 出 来 。 某 
些 形状 或 颜色 可 以 将 对 象 和 背景 区 别 开 来 。 由 于 发 生 在 有 意识 处 理 前 ， 因 此 令 事 物 变 得 醒目 背 
后 的 理论 机 制 叫做 下 意识 处 理 。” Ware 提 到 的 “短暂 一 警 ” 通 常 指 30 一 300 毫 秒 不 等 的 时 长 。 
Ware 的 以 下 评论 显示 了 下 意识 处 理 的 重要 性 (Ware, 2004, page 149). 

对 下 意识 处 理 的 理解 也 许 是 视觉 科学 对 数据 可 视 化 的 最 重要 的 贡献 。 

不 需要 有 意识 处 理 就 能 获取 到 信息 将 带 来 大 量 的 好 处 ， 因 此 对 交互 设计 者 而 言 一 个 明显 的 
问题 就 是 “我 们 如 何 使 信息 变 得 突出 ? ", Ware (2004) 从 人 类 视觉 系统 角度 对 下 意识 处 理 进 
行 了 深入 的 讨论 。 我 们 在 这 里 通过 一 些 例子 来 为 交互 设计 者 提供 一 些 基础 的 概念 。 

对 于 熟悉 英国 地 图 的 用 户 而 言 , 第 一 眼看 到 图 3-32 就 能 迅速 找到 英国 人 口 密度 最 大 的 城市 。 
同样 ， 图 3-33 一 图 3-35 中 不 同 于 其 他 的 那个 物体 能 被 迅速 地 定位 。 下 意识 处 理 还 可 以 帮助 我 们 
在 图 3-36 中 迅速 定位 蓝 色 的 方块 。 需 要 注意 的 是 ， 在 图 3-37 中 的 多 个 红色 或 蓝 色 的 方块 或 圆 中 
定位 一 个 红色 的 方块 时 ， 下 意识 处 理 并 未 出 现 ， 需 要 对 这 些 物体 做 仔细 审查 才能 找到 这 个 红色 
方块 。 这 是 由 于 对 同时 满足 方块 (相对 于 圆 ) 和 红色 《相对 于 蓝 色 ) 物体 的 定位 需要 用 到 “ 联 


合 编码 ”(conjunction encoding), 





方向 
图 3-33 有 异 于 其 他 的 线条 可 以 通过 下 意识 处 理 得 到 快速 定位 


形状 
图 3-34 特别 的 形状 经 常 是 醒目 的 


45 
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图 3-37 联合 编码 导致 红色 方块 不 能 被 下 意识 处 理 〈 见 彩 图 ) 


以 上 最 后 一 个 例子 并 不 意味 着 “多 车 物 醒 目 ”(multiple pop-outs) 是 不 可 能 的 。 一 个 最 具 
代表 性 的 例子 是 Irani 和 Eskicioglu 在 2003 年 提出 的 移动 电话 网 络 性 能 的 新 颖 描述 。 图 3-38 是 对 
网 络 中 每 个 单元 的 描述 ， 颜 色 和 大 小 代表 重要 的 性 能 指标 。 为 了 使 多 单元 描述 变 得 更 紧 凌 ， 
他 们 为 每 个 单元 加 置 了 一 个 如 图 3-39 所 示 的 外 边框 。 一 旦 专业 用 户 锁定 了 如 新 增 通话 阻隔 率 
等 某 个 特定 性 能 ， 不 需要 考察 其 他 属性 编码 ， 该 选 定性 能 的 相关 信息 就 能 自然 地 得 到 凸显 。 
我 们 可 以 看 到 这 种 描述 的 一 个 优势 是 图 3-39 的 上 半 部 中 出 现 的 箭头 使 得 额外 单元 的 位 置信 息 

变 得 醒目 。 

以 上 讨论 的 例子 都 是 关于 数据 的 静态 描述 。 幸 运 的 是 ， 下 意识 处 理 的 优势 可 以 通过 手动 或 
自动 控制 的 动画 得 以 扩展 。 例 如 ， 图 3-40 显 示 了 和 图 3-32 相 同 的 人 口 密度 分 布 图 ,不 同 的 是 另 
外 附加 了 一 个 1900 年 以 来 的 时 间 表 。 如 果 该 时 间 表 的 每 一 个 时 段 所 对 应 的 地 图 能 依次 显示 5 一 
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10 秒 (图 的 大 小 表示 人 口 密度 )， 那 么 可 以 很 容易 地 得 到 城市 人 口 变化 的 心理 模型 。 即 使 每 幅 
地 图 是 静态 的 ， 新 的 人 口中 心 城市 的 出 现 也 可 以 立即 变 得 醒目 。 第 5 章 将 详细 讨论 如 何 利 用 动 
画 来 凸显 信息 。 


使 用 负载 | 增长 方向 







强度 


图 3-38 移动 电话 网 络 性 能 描述 ( 见 彩 图 ) 


上 午 11:30 至 
下 午 12:30 


\ 


图 3-39 移动 电话 网 络 一 个 小 时 内 (11:30 一 12:30) 的 平均 性 能 描述 ( 见 彩 图 ) 





图 3-40 圆 的 大 小 随 着 时 间 的 变化 而 改变 ， 使 得 人 口 的 突然 变化 变 得 醒目 
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虽然 图 3-40 使 用 大 小 来 表示 城市 人 口 看 似 是 合 理 的 , 但 是 人 们 还 是 会 问 一 个 很 自然 的 问题 : 
“为 什么 ”为 什么 不 使 用 阴影 、 条 状 图 、 颜 色 或 形状 ? ”。 我 们 已 经 看 到 一 些 应 用 (例如 
Minard 地 图 ) 适合 用 圆 或 线条 的 大 小 或 粗细 进行 量化 编码 。 在 这 些 例子 中 颜色 和 形状 可 能 不 太 
适合 ， 它 们 更 适合 需要 对 物体 的 相似 度 或 差异 度 进行 判断 的 情况 。 我 们 可 以 很 清楚 地 看 到 对 给 
定 任务 设 定编 码 指导 原则 的 必要 性 ， 但 要 认识 到 这 些 原 则 是 取决 于 诸多 因素 的 。 我 们 接 下 来 将 
对 这 个 问题 进行 简要 讨论 。 

3. 编码 选择 

虽然 Mackinlay (1986) 指出 “现在 没有 一 个 公认 的 人 类 认 知 能 力 理论 可 以 用 于 证 明 图 形 
语言 的 有 用 性 "， 但 还 是 有 一 些 可 用 的 编码 选择 原则 可 供 参考 。 我 们 在 这 里 主要 讨论 其 中 三 个 
原则 。 第 一 个 例子 由 法 国信 息 可 视 化 先驱 Bertin (1967, 1983) 提供 。 第 二 个 例子 是 关于 统计 
学 家 Cleveland 和 McGill (1984) 对 数值 型 变量 各 种 编码 的 判断 精度 的 评估 。 第 三 个 例子 来 自 
Mackinlay (1986)， 其 主要 考虑 顺序 型 、 类 别 型 和 数值 型 数据 。 

4. Bertin 指 导 原 则 

Bertin 提 出 了 信息 可 视 化 的 四 个 常规 任务 以 及 他 认为 适合 这 些 任务 的 编码 方法 。 他 将 结论 
表述 在 一 个 和 图 3-41 类 似 的 图 表 中 。 其 中 “标记 ”(mark) 一 词 表示 编码 结果 (例如 一 条 线 或 
一 个 着 色 的 图 )。 其 基本 任务 主要 分 为 四 类 : 


排序 : 能 数量 : 能 


KG: 能 SH EM 感知 到 标记 感知 到 标记 
感知 到 标记 AAP PAE 是 经 过 排序 是 相互 对 应 
是 相似 的 。 成 “群体 ” 的 成 比例 的 
大 小 
数值 
纹理 
颜色 
方位 
形状 





图 3-41 对 四 类 常规 任务 的 Bertin 编 码 原则 ( 见 彩 图 ) 


。 关 联 : 
。 选 择 . 
。 排序. 
HE. 
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关注 对 标记 相似 度 的 感知 。 

在 这 里 Bertin 关 注 的 是 标记 是 否 能 被 区 分 ， 从 而 形成 不 同 的 “群体 。 
能 看 出 标记 是 经 过 排序 的 吗 ? 

能 看 出 标记 是 相互 对 应 成 比例 的 吗 ? 


这 些 编码 原则 (通常 也 叫 视 网 膜 变 量 ) 主要 涉及 大 小 、 数 值 8、 纹 理 、 颜 色 、 方 位 和 形状 。 
从 图 3-41 中 可 以 看 到 ，Bertin 根 据 各 个 编码 方法 所 支持 的 基本 任务 类 型 对 它们 进行 了 大 致 的 排 
序 。 对 图 3-41 的 深入 探索 证 明了 这 些 编码 原则 的 合理 性 。 但 是 需要 指出 的 是 ， 合 理 编码 原则 的 
选取 取决 于 具体 的 应 用 环境 ， 因 此 这 些 原则 还 需要 进一步 的 讨论 。 

平 铺 条 形 图 (TileBars, Hearst, 1995) 界面 显示 了 任务 对 Bertin 编 码 方法 的 影响 。 平 铺 条 形 
图 支持 的 任务 是 在 文件 集合 中 找到 和 某 个 特定 用 户 查 询 相关 的 文件 子 集合 。 它 从 用 户 接收 一 组 
主题 词 以 及 一 组 可 能 相关 或 不 相关 的 文件 。 例 如 ， 假 设 用 户 对 骨 质 疏松 症 的 预防 有 兴趣 ， 可 能 
会 提供 如 图 3-42 所 示 的 三 个 关键 词 。 与 之 对 应 ， 平 铺 条 形 图 会 为 每 个 文件 返回 一 个 如 图 3-43 上 
半 部 所 示 的 相关 性 描述 。 其 中 每 行 对 应 一 个 主题 词 ， 列 对 应 文件 的 每 个 片段 (可 能 是 段落 、 页 
或 章节 ) 。 每 个 方块 代表 一 个 片段 ， 它 的 阴影 密度 表示 该 片段 中 主题 词 出 现 的 频率 。 因 此 ， 从 
图 中 可 以 看 到 ， 在 “制药 业 的 最 新 研究 成 果 ” 一 文 的 第 一 个 片段 中 预防 一 词 的 出 现 频率 高 于 研 
完 和 骨 质 疏松 症 。 在 第 五 个 片段 中 的 三 个 主题 词 都 被 反复 提 及 ， 这 意味 着 该 文章 值得 进一步 地 
检索 ， 而 且 检 索 最 好 从 第 五 个 片段 开始 。 对 第 五 列 做 交互 可 以 看 到 图 3-43 下 半 部 所 示 的 描述 ， 
显示 了 对 应 的 文章 段落 ， 出 现在 其 中 的 主题 词 得 到 高 显 (如 图 3-43 下 图 所 示 )。 


图 3-43 








sik ak Be 
图 3-42 用 户 定义 的 三 个 感 兴趣 的 主题 词 ( 见 彩 图 ) 
制药 业 的 最 新 研究 成 果 


中 BEER? BOG 88 





I TT 





Fortunately, scientific knowledge about this desease has grown, and there is reason for hope 
(Research is revealing ha may be achieved through estrogen replacement therapy 
for older women and through adequate calcium intake and regular weight-bearing exercise 
for people of all ages. New approaches to diagnosis and treatment are also under active 
investigation. For this work to continue and for use to take advantage of the knowledge we 
have already gained, public awareness “peter and of the importance of further 
scientific peah is essential. 


(上 图 ) 平 铺 条 形 图 显示 了 段落 和 主题 词 间 的 相关 性 ， (下 图 ) 在 被 选段 落 中 出 现 的 主 
题词 得 到 高 显 〈( 见 彩 图 ) 


O 根据 Bertin 定 义 (Bertin, 1967; 1983, page 73) ， 数 值 不 仅仅 局 限于 灰 度 级 , “数值 可 以 从 黑 经 由 灰 、 蓝 或 红 
过 湾 到 白 "。 
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5. 对 数值 型 数据 编码 的 判断 精度 

统计 学 家 Cleveland 和 McGill (1984) 从 不 同 角度 对 编码 方法 进行 了 研究 ， 重 点 讨论 人 们 
对 数值 型 数据 各 种 编码 方式 的 判断 精度 。 该 研究 同 Bertin 的 编码 机 制 类 似 ， 具 体 来 说 是 在 单 变 
量 数 值 型 数据 的 基础 上 对 图 3-41 中 的 Bertin 什 阵 的 最 后 一 列 进行 了 研究 。 他 们 的 研究 成 果 显 示 
在 图 3-44 中 ， 各 编码 方法 根据 所 支持 的 对 数值 的 判断 精度 排序 。 


色 
< Mies] e 
密度 


图 3-44 Cleveland 和 McG 训 建立 的 编码 评估 机 制 显示 了 对 数值 型 数据 编码 方式 精确 度 进行 判断 的 难度 ( 见 彩 图 ) 


6. 数值 型 、 顺 序 型 和 类 别 型 数据 

Mackinlay (1986) 对 数值 型 和 非 数值 型 数据 的 编码 做 了 深入 研究 ， 提 出 了 如 图 3-45 所 示 
的 排序 。Mackinlay 指 出 ， 间 一 编码 方式 在 图 中 三 种 排序 中 的 不 同位 置 取决 于 其 “涉及 的 附加 
URES". 


顺序 型 





Bass 





图 3-45 Mackinlay 对 数值 型 、 顺 序 型 和 类 别 型 数据 的 编码 指导 ( 见 彩 图 ) 


前 面 讨论 过 的 描述 方法 均 能 在 图 3-45 找 到 ， 它 们 中 的 一 部 分 作为 示例 出 现 ， 但 并 未 出 现在 
排名 顶端 ， 这 显示 了 编码 方法 的 选择 受 诸多 因素 的 影响 。 例 如 ， 在 Minard 地 图 中 很 难 用 位 置 代 
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BRAKE (线条 宽度 ) 来 表示 军队 数量 。 同 样 的 ，Beck 也 很 难 用 除 颜 色 以 外 的 其 他 属性 
来 区 分 不 同 的 地 铁 线 。Minard 很 难 用 位 置 来 描述 进军 和 撤军 的 顺序 。 我 们 必须 明确 这 幅 地 图 的 
设计 目的 在 于 保证 信息 的 凸显 及 强调 定性 理解 (例如 , “只 有 很 少 一 部 分 士兵 活着 回来 了 )。 
如 果 用 户 感 兴趣 ， 可 以 通过 查看 具体 数据 将 之 变 为 定量 理解 。 类 似 的 ， 图 3-31 中 用 圆 的 大 小 来 
描述 电路 中 每 个 部 件 对 电路 整体 性 能 的 影响 力 ， 主 要 是 考虑 到 电路 设计 师 (至 少 在 初级 设计 阶 
R) 更 关注 某 些 部 件 的 效力 大 小 。 用 多 维 图 标 来 表示 一 栋 住房 的 不 同属 性 是 出 于 另外 的 考虑 ， 
其 中 的 图 标 式 编码 设计 是 选择 超 变量 数据 编码 方式 时 需要 考虑 的 另外 一 个 因素 ， 我 们 将 在 后 面 
章节 中 加 以 讨论 。 


3.1.4 超 变量 数据 


超 变 量 数 据 (也 叫 多 变量 数据 ) 描述 一 直 是 一 个 富有 挑战 的 课题 ， 刺 激 着 新 技术 的 不 断 产 
生 。 许 多 实际 问题 都 涉及 高 维 数据 ， 能 从 一 定 程度 上 通过 信息 可 视 化 加 以 解决 。 即 使 是 最 简单 
的 芯片 设计 也 可 能 涉及 超过 100 个 部 件 ， 这 些 属 性 的 设 定 必须 满足 超过 200 种 设计 规范 。 类 似 
的 ， 选 取 投资 专家 或 决定 是 否 研发 新 药 都 涉及 复杂 的 决策 过 程 。 在 习题 3.3 中 我 们 将 看 到 ， 即 
使 是 为 学 生 筛 选 最 具 代 表 性 的 8 项 学 术 成 绩 都 有 可 能 是 一 项 复杂 的 任务 。 

前 面 讨 论 过 的 一 些 数 据 描述 方法 可 以 在 某 些 限定 条 件 下 进行 扩展 以 用 于 对 超 变 量 数据 的 描 
述 。 例 如 ， 用 于 描述 文字 的 平 铺 条 形 图 可 以 描述 多 于 三 个 的 关键 词 ， 交 互 式 直方 图 (将 在 下 面 
讨论 到 ) 可 以 扩展 到 多 个 属性 ， 第 2 章 中 提 到 的 条 形 图 可 以 有 效 地 用 于 具有 多 属性 的 一 组 对 象 
的 描述 。 

1. 坐标 图 (coordinate plots) 

(1) 平行 坐标 图 (parallel coordinate plots) 

超 变 量 数据 描述 中 最 流行 且 最 具 价 值 的 方法 叫 平行 坐标 图 (Inselberg, 1985, 1997; 
Wegman, 1990)。 为 了 讨论 该 方法 的 基本 原理 ， 我 们 首先 假设 一 个 简单 的 双 变量 数据 例子 : 用 
一 个 散 点 图 表示 两 栋 住 房 的 细节 ( 见 图 3-46) ， 每 栋 住房 表示 为 图 中 的 一 个 点 。 想 象 一 下 ， 现 
在 散 点 图 的 两 轴 被 拆 分 并 放置 为 两 条 平行 的 轴 ( 见 图 3-47)。 由 于 住房 必须 由 两 轴 上 的 各 一 点 
来 共同 描述 ， 因 此 轴 上 的 点 数 会 双 倍 增加 。 


房间 数 





图 3-46 一 个 简单 的 散 点 图 显示 了 两 栋 住房 的 价格 和 上 房间 数 
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价格 房间 数 
图 3-47 平行 坐标 图 是 散 点 图 的 替代 描述 法 ， 两 属性 轴 变 为 平行 ， 因 此 需要 用 两 个 点 来 描述 一 栋 住房 


为 了 显示 表示 同一 栋 住房 在 两 轴 上 的 点 之 间 的 联系 ， 可 以 在 这 两 点 间 加 上 直线 和 标签 〈 见 
图 3-48) 。 我 们 可 以 从 这 种 描述 中 得 到 什么 信息 ? 对 于 双 变 量 数据 ， 我 们 并 不 能 从 中 得 到 什么 。 
但 如 果 需 要 处 理 的 是 包含 多 个 属性 的 对 象 ， 这 样 的 平行 坐标 图 能 带 来 很 多 的 好 处 。 图 3-49 显 示 
了 6 个 对 象 的 平行 坐标 图 ， 每 个 对 象 具有 A 到 G 7 种 属性 。 每 个 对 象 分 别 由 每 个 轴 上 的 一 点 加 以 
描述 ， 这 些 点 由 线段 连接 。 从 图 中 我 们 可 以 立即 (下 意识 的 ) 发 现 属性 A 和 B 之 间 的 相对 性 以 
及 属性 B 和 C 之 间 的 强 相关 性 。 虽 然 平行 坐标 图 已 经 在 很 多 商业 信息 可 视 化 工具 中 得 到 应 用 ， 
我 们 还 是 必须 指出 它 的 一 些 不 足 之 处 。 例 如 ， 对 于 图 3-49 所 示 的 数据 ， 很 难看 出 属性 B 和 E 之 间 
的 相对 性 以 及 属性 C 和 G 之 间 的 相关 性 。 换 句 话说 ， 属 性 的 顺序 强烈 地 影响 着 关系 发 现 的 难度 。 





房间 数 


图 3-48 为 了 避免 用 两 点 描述 一 栋 住 房 带 来 的 模糊 性 ， 将 这 两 点 用 线段 连 楼 并 加 上 标签 





A B Cc D E F G 
图 3-49 6 个 对 象 的 平行 坐标 图 ， 每 个 对 象 具 有 A 一 G 7 种 属性 。 很 容易 发 现 属性 A 和 B 之 间 的 相对 


性 以 及 属性 B 和 C 之 间 的 相关 性 ， 但 属性 B 和 E 之 间 的 相对 性 以 及 属性 C 和 G 之 间 的 相关 性 
却 很 难看 出 
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同 其 他 很 多 可 视 化 工具 一 样 ， 交 互 可 以 为 平行 坐标 图 带 来 很 多 的 好 处 (Siirtola, 2000). 
例如 ， 可 以 设 定 某 个 属性 的 范围 ， 让 所 有 落 入 这 个 范围 的 对 象 的 线条 得 到 高 显 ( 见 图 3-50) ; 
对 属性 范围 的 手动 实时 修改 使 得 用 户 可 以 快速 理解 不 同属 性 间 的 关系 。 其 他 附加 功能 有 平均 值 、 
标准 方差 以 及 Tukey 箱 形 图 等 。 如 果 同 时 设 定 两 个 属性 范围 ， 可 以 对 它们 做 “与 ”或 者 “或 ” 
的 操作 ， 即 只 高 显 同时 满足 两 个 条 件 范围 或 至 少 其 中 之 一 的 对 象 线条 S。 平 行 坐标 图 有 大 量 的 
应 用 ， 例 如 利用 其 提高 芯片 制造 效率 (Inselberg, 1997), 
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图 3-50 表示 多 辆 汽车 的 平行 坐标 图 ， 符 合 设 定年 代 属 性 的 所 有 汽车 数据 得 到 高 显 。 图 片 来 源 ; 
Harri Siirtola 

对 平行 坐标 图 所 能 带 来 的 益处 做 探讨 是 十 分 必要 的 。 在 散 点 图 中 ， 每 个 对 象 能 很 容易 地 得 
到 定位 ， 并 且 和 其 他 对 象 有 着 清晰 的 区 别 。 但 在 平行 坐标 图 中 就 不 然 了 ， 因 为 每 个 对 象 由 连接 
多 个 点 的 多 条 线段 表示 ， 而 这 些 线条 又 常常 和 其 他 对 象 的 线段 交叉 。 平 行 坐标 图 里 最 明显 的 就 
是 各 个 属性 的 特点 以 及 它们 之 间 可 能 存在 的 本 质 关 系 。 因 此 ， 从 迅速 获取 的 醒目 启示 中 ， 我 们 
常常 可 以 得 出 诸如 “大 多 数 车 有 四 个 气缸 ”或 “似乎 低 MPG 的 汽车 价格 都 比较 高 ”等 结论 。 
因此 ， 我 们 认为 平行 坐标 图 支持 属性 可 见 性 (attribute visibility) 。 这 里 的 可 见 性 指 不 用 耗费 大 
量 认 知 成 本 就 能 下 意识 地 获取 信息 的 能 力 。 等 我 们 讨论 了 足够 多 的 编码 示例 后 ， 我 们 会 再 回 过 
头 来 介绍 可 见 性 和 关联 性 的 概念 。 

平行 坐标 图 和 其 他 一 些 技 术 共 同 享有 的 一 个 重要 优势 是 它们 的 复杂 度 (在 这 里 特 指 轴 的 数 
A) 和 属性 数量 直接 相关 。 有 时 它 还 有 -一 个 其 他 技术 所 不 具有 的 优势 ， 所 有 属性 享有 平等 性 
(Feiner and Beshers, 1990), 对 平行 坐标 图 的 持续 研究 可 参看 文献 (Bendix er al., 2005: 
Siirtola, 2006) 。 

(2) 星 形 图 

星 形 图 在 本 质 上 和 平行 坐标 图 很 类 似 : 对 象 的 每 个 属性 表示 为 轴 上 的 - -点 ， 该 对 象 的 所 有 
属性 所 对 应 的 点 用 直线 加 以 连接 。 二 者 的 区 别 在 于 星 形 图 中 所 有 轴 都 从 一 个 相同 的 原点 往外 发 
散 。 因 此 ， 从 一 幅 学 生成 绩 图 (图 3-51) 的 星 形 图 中 可 以 看 到 ， 和 班级 平均 成 绩 相 比 (灰色 区 
域 的 边界 ) ， 该 学 生 的 数学 和 化 学 成 绩 很 好 ， 但 运动 和 文学 比较 差 。 为 了 和 另 一 个 天 才学 生 


O 有 心 的 读者 可 能 发 现 该 图 中 汽车 的 马力 或 每 加 仑 公里 数 通常 为 无 意义 的 零 值 。 实 际 上 ， 这 些 数 据 是 有 误导 
性 的 ， 数 据 的 缺失 为 可 视 化 设计 者 带 来 了 新 的 挑战 。 
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Tony 做 比较 ， 可 以 用 到 两 个 独立 的 星 形 图 (图 3-52)。 星 形 图 的 形状 可 以 提供 对 学 生成 绩 的 基 
本 印象 ， 并 且 支 持 对 不 同学 生 的 对 比 。 因 此 ， 可 以 认为 星 形 图 提供 了 对 和 象 可 见 性 (object 
visibility ) 。 平 行 坐标 图 特别 适合 于 观察 不 同属 性 间 的 关系 ， 而 星 形 图 更 有 助 于 特定 对 象 的 比 
较 。 星 形 图 已 经 应 用 于 各 种 事物 的 对 比 ， 如 警察 部 队 或 抵押 贷款 等 。 可 以 将 其 他 一 些 编码 技术 
如 颜色 和 粗细 等 加 入 到 星 形 图 中 以 提供 额外 的 灵活 性 。 


数学 





图 3-51 在 星 形 图 中 ， 所 有 属性 轴 都 始 于 相同 的 一 个 原点 。 由 于 形状 通常 可 以 有 效 地 表示 一 个 对 
象 的 多 个 属性 ， 因 此 每 个 轴 上 的 点 可 以 连接 起 来 形成 一 个 形状 。 其 他 有 用 信息 如 平均 值 
或 闪 值 也 可 以 表示 在 星 形 图 中 





Bob 的 成 绩 Tony 的 成 绩 
图 3-52 星 形 图 可 以 用 于 比较 两 个 不 同 对 象 的 属性 。 本 图 显示 了 两 个 不 同学 生 的 各 科 考 试 成 绩 
(具体 科目 名 称 见 图 3-51) 


2. HS, BB 4E BE 

我 们 在 三 变量 数据 描述 中 讨论 过 的 散 点 图 和 矩阵 也 可 以 用 于 超 变量 数据 的 描述 。 但 是 该 描述 
的 一 个 主要 缺点 是 由 于 数据 维 数 的 增加 ， 成 对 的 属性 数目 大 量 增加 。 两 个 属性 只 需要 一 个 散 点 
图 ， 三 个 属性 需要 三 个 散 点 图 ， 而 对 于 四 个 属性 我 们 需要 六 个 散 点 图 。 因 此 ， 对 于 有 四 个 属性 
的 100 栋 住房 ， 散 点 图 中 将 出 现 600 个 点 。 这 和 平行 坐标 图 以 及 后 面 将 会 讨论 到 的 属性 浏览 器 
的 线性 增加 的 复杂 度 相 矛盾 。 虽然 对 散 点 图 能 处 理 的 属性 数 最 大 值 没 有 严格 理论 界定 ， 但 复杂 
度 对 维度 的 依赖 性 时 常 成 为 一 个 制约 因素 。 

Ahlberg 等 结合 散 点 图 和 其 他 一 些 编码 技术 提出 了 一 种 超 变量 数据 的 有 效 描述 (Ahlberg et 
al., 1992; Ahlberg and Shneiderman, 1994)。 电影 选择 器 (图 3-53) 是 一 个 交互 式 电影 选择 工具 ， 
在 主要 的 〈 散 点 图 ) 显示 区 域 中 ,每 个 彩色 方块 表示 一 部 电影 ， 颜色 表示 电影 类 型 (如 恐怖 片 、 
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音乐 片 等 )。 每 个 方块 的 水 平 坐标 表示 电影 制作 年 代 ， 纵 坐标 表示 电影 时 长 。 位 于 右边 的 滑 块 
可 以 用 于 设置 导演 或 演员 等 电影 属性 条 件 ， 拖 动 条 用 于 设置 电影 制作 年 代 或 时 长 〈 见 图 3-54) 。 
这 个 电影 选择 器 显示 了 充分 结合 各 种 不 同 技术 的 优势 。 


a 018. 140 1950 1970 | 





图 3-53 通过 额外 的 选择 技术 来 增强 散 点 图 的 功用 ， 人 允许 用 户 对 如 片 型 、 时 长 、 制 作 年 代 等 电影 
属性 进行 选择 (MKA) 





图 3-54 当 用 户 选 择 了 特定 的 制作 年 代 和 时 长 范围 后 ， 系 统 自动 显示 符合 条 件 的 电影 的 细节 信息 
( 见 彩 图 ) 


3. 关联 直方 图 
我 们 在 讨论 双 变量 数据 时 介绍 的 关联 直方 图 也 可 以 推广 到 超 变量 数据 的 描述 。 在 属性 浏览 
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器 中 加 入 额外 编码 技术 可 以 显著 增强 系统 功效 (Tweedie et al., 1994; Spence and Tweedie, 
1998)。 我 们 可 以 通过 购买 住房 或 汽车 这 样 的 例子 来 展示 该 技术 的 一 般 实用 性 : 

对 于 给 定 的 有 多 个 属性 描述 的 一 组 对 象 ， 要 想 找 到 最 合适 的 对 象 或 几 个 待 选 对 象 ， 需 要 进 
行 更 多 的 细节 性 考虑 。 

在 介绍 属性 浏览 器 之 前 ， 我 们 要 特别 指出 这 个 工具 (以 及 其 他 技术 ) 的 一 个 很 重要 的 任务 : 

从 超 变量 数据 中 提取 信息 启示 。 

我 们 首先 从 检查 一 组 住房 的 价格 属性 直方 图 着 手 (图 3-55) 。 每 栋 住房 被 表示 为 直方 图 中 
的 一 个 小 方块 。 设 定 一 个 价格 范围 后 ， 可 以 清楚 地 看 到 符合 条 件 的 住房 高 显 为 绿色 ， 它 们 可 以 
作为 用 户 初始 查看 时 认为 可 负担 的 备 选 项 (图 3-56) 。 落 在 这 个 价格 区 间 之 外 的 住房 也 得 到 显示 ， 
其 原因 我 们 马上 会 讨论 。 购 买 住房 时 要 考虑 的 因素 有 很 多 ， 为 了 方便 地 建立 属性 浏览 器 的 基本 
概念 ， 我 们 在 这 里 只 考虑 其 中 三 个 属性 : 价格 、 房 间 数 和 花园 面积 。 图 3-57 显 示 了 同 图 3-56 相 
同 价格 范围 的 属性 直方 图 ， 符 合 该 价格 范围 的 住房 在 所 有 直方 图 中 均 得 到 高 显 ， 这 也 是 扫 光 技 
术 的 一 个 体现 。 从 图 中 可 以 清楚 地 看 到 所 设 定 的 价格 范围 同 花 园 面积 及 房间 数 之 间 的 关系 。 通 
过 动态 探索 如 前 后 移动 价格 范围 ， 就 可 以 很 清楚 地 看 到 房屋 价格 和 房间 数 之 间 的 关联 性 。 如 果 
在 此 基础 上 添加 其 他 属性 限制 条 件 (图 3-58)， 则 只 有 符合 所 有 属性 条 件 的 住房 才 得 到 绿色 高 
显 。 同 样 的， 通过 移动 属性 范围 值 或 改变 上 下 限 可 以 帮助 用 户 在 住房 数据 中 提取 出 有 用 信息 ， 
从 而 逐步 确定 值得 进一步 考察 的 住房 。 由 于 是 通过 属性 对 住房 进行 查看 ， 因 此 这 种 技术 称 为 属 
PED WE o 








图 3-55 一 组 住房 的 价格 直方 图 。 图 中 的 黄色 小 方 图 3-56 设置 价格 属性 范围 ， 符 合 条 件 的 住房 得 到 
块 表示 其 中 一 栋 住房 《 见 彩 图 ) 绿色 高 显 ( 见 彩 图 ) 





图 3-57 价格 范围 和 图 3-53 相 同 ， 符 合 该 条 件 的 住房 在 其 余 两 个 直方 图 中 同样 得 到 高 显 ( 见 彩 图 ) 
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图 3-58 只 有 满足 所 有 条 件 的 住房 才 得 到 高 显 。 仅 不 满足 其 中 一 项 条 件 的 住房 显示 为 黑色 ， 因 此 
如 果 放 宽 对 应 的 限制 条 件 ， 这 些 黑 色 的 住房 就 能 变 为 绿色 ( 见 彩 图 ) 


颜色 编码 在 属性 浏览 器 中 扮演 着 重要 的 角色 。 黑 色 表 示 的 是 仅 不 满足 一 个 条 件 的 住房 。 因 
此 ， 如 果 一 栋 黑 色 住房 位 于 设 定 区 间 外 ， 则 该 属性 是 这 栋 住房 唯一 不 满足 的 条 件 。 这 是 非常 有 
用 的 信息 。 如 果 消 费 者 设 定 了 房屋 的 价格 上 限 ， 他 们 自然 也 希望 了 解 所 有 唯一 不 满足 这 个 条 件 
但 和 设 定价 格 范围 相差 不 大 的 住房 。 扩 大 区 间 范 围 将 使 黑色 住房 纳入 满足 条 件 的 住房 范畴 ， 同 
时 使 它 的 颜色 由 黑色 变 为 绿色 ， 即 说 明 该 住房 由 不 满足 该 条 件 变 为 满足 所 有 条 件 。 

图 3-59 说 明 在 没有 满足 所 有 条 件 的 住房 的 情况 下 ， 黑 色 编 码 的 作用 变 得 尤为 突出 。 在 这 个 
例子 中 ， 我 们 看 到 只 需 再 多 付 一 点 钱 ， 就 有 一 栋 住房 符合 所 有 条 件 ， 将 房间 数 放宽 至 三 个 房 
间 ， 就 可 以 看 到 许多 符合 条 件 的 住房 。 令 人 吃惊 的 是 ， 现 有 的 房屋 在 线 销售 系统 中 很 少 提 供 
这 个 功能 。 





J 


图 3-59 即使 没有 满足 所 有 条 件 的 住房 ， 唯 一 不 满足 一 个 条 件 的 黑色 住房 也 为 放松 限制 提供 了 指 
导 方 向 ( 见 彩 图 ) 


对 于 特别 是 有 体验 的 用 户 来 说 ， 属 性 浏览 器 的 实用 性 是 不 言 而 喻 的 ， 例 如 选 定 在 特定 日 期 
内 的 航班 、 购 买 移动 电话 或 洗衣 机 等 。 属 性 浏览 器 可 以 和 其 他 技术 相 结合 ， 例 如 ， 在 平行 坐标 
图 的 每 个 轴 上 显示 一 个 属性 浏览 器 直方 图 用 以 进一步 观察 属性 值 的 分 布 情况 ， 或 者 通过 扫 光 技 
术 来 查看 属性 间 的 关系 。 当 然 ， 属 性 浏览 器 不 仅仅 局 限于 数值 型 数据 ， 它 还 可 以 处 理 数值 型 、 
类 别 型 和 顺序 型 数据 的 组 合 。 数 据 可 视 化 滑 块 (Eick, 1994) 是 和 属性 浏览 器 同时 期 出 现 的 另 
一 种 技术 。 为 实现 交互 式 属性 范围 的 设 定 ， 作 者 特别 强调 :“ 内 部 空间 的 利用 ， 例 如 使 用 交互 
式 颜 色 带 、 为 离散 数据 提供 条 形 图 、 为 连续 数据 提供 密度 图 等 ， 都 可 以 增强 滑 块 的 可 用 性 。” 
(Li and North, 2003) 通过 一 系列 任务 对 属性 浏览 器 和 动态 查询 界面 ( 见 第 5 章 图 5-23) 做 了 对 
比 。 研 究 结果 显示 浏览 器 中 提供 的 扫 光 直方 图 有 助 于 解决 复杂 的 任务 ， 并 且 该 技术 可 以 通过 可 
缩放 界面 或 颗粒 度 控制 等 措施 得 以 改进 。 
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设计 属性 浏览 器 的 初衷 是 为 了 支持 基于 属性 的 从 多 个 对 象 中 选取 一 个 对 象 的 任务 ， 它 同时 
也 支持 从 数据 中 获取 信息 启示 的 探索 活动 。 例 如 ， 瑞 典 国防 研究 局 将 属性 浏览 器 作为 调查 工具 
( 见 图 3-60， 具 体 细 节 见 第 6 章 ) 。 图 3-57 中 显示 的 是 在 斯 德 哥 尔 摩 地 铁 中 进行 的 一 次 地 铁 出 轨 
演习 中 收集 到 的 三 维 通 信 数 据 (Morin and Albinsson, 2005) 。 数 据 主要 分 为 以 下 几 个 类 型 : 发 
送 者 (1710)、 接 收 者 也 是 现场 指挥 官 (1050) 以 及 两 类 消息 类 型 (报告 和 质疑 )。 绿 色 部 分 
显示 1710 发 起 的 大 部 分 通话 是 向 1050 提 供 的 报告 和 质疑 。 这 些 相关 数据 同时 也 显示 在 属性 济 
览 器 下 方 的 列表 中 。 
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图 3-60 属性 浏览 器 显示 了 一 场 灾难 救援 演习 中 收集 到 的 三 维 通信 数据 ， 它 支持 分 析 者 的 交互 式 
探索 ( 见 彩 图 ) 


4. R&A 

WE (mosaic plots) 的 概念 可 以 通过 泰坦 尼克 号 一 例 加 以 解释 。 泰 坦 尼克 号 事件 发 生 
在 1912 年 春 ，2201 人 中 有 1731 名 旅客 及 工作 人 员 丧 生 (Dawson, 1995) 。 表 3-1 显 示 的 原始 数据 
包含 四 个 属性 : 性 别 、 是 否 存活 、 舱 位 等 级 以 及 成 人 /儿童 。 如 果 没 有 仔细 分 析 ， 很 难 从 这 个 
表 中 读 出 有 用 信息 。 我 们 可 以 通过 以 下 方法 生成 一 个 对 应 的 镶嵌 图 (Friendly, 1992, 1994, 
2000): 首先 生成 一 个 矩形 ， 令 它 的 面积 表示 船上 的 总 人 数 (图 3-61a)。 然 后 根据 舱位 等 级 将 
这 个 矩形 分 成 四 个 稍 小 的 和 矩形， 它们 的 面积 表示 各 舱位 的 人 员 数 (图 3-61b)。 下 一 步 再 根据 各 
舱位 内 的 人 员 性 别 对 这 四 个 矩形 进行 细 分 (图 3-61c)， 从 中 我 们 可 以 立即 看 出 一 些 信息 ， 如 头 
等 舱 、 二 等 舱 和 三 等 舱 中 的 男女 比例 。 最 后 ， 我 们 根据 存活 与 否 (存活 表示 为 绿色 ， 死 亡 表 示 
为 黑色 ) 或 成 人 /儿童 对 已 有 和 矩形 进行 再 次 细 分 ， 得 到 图 3-61d。 这 个 镶 贱 图 提供 了 对 泰坦 尼克 
号 事件 的 最 直观 的 描述 ， 同 时 也 可 以 回答 很 多 新 的 问题 ， 比 如 “乘坐 三 等 舱 的 女性 有 哪些 ?”、 
“为 什么 头等 舱 的 大 多 数 女性 都 幸存 下 来 了 ? ”"、“ 为 什么 女童 存活 率 高 于 男 童 ? ”等 。 
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表 3-1 泰坦 尼克 号 事件 的 原始 数据 





fit ON fi ON Ai ON am oy 


头等 舱 二 等 舱 = HA LIAR 





a) 





ET TE 
成 人 儿童 


头等 舱 二 等 舱 三 等 舱 ”工作 人 员 头等 舱 二 等 舱 三 等 舱 TEAR 
d) c) 


图 3-61 泰坦 尼克 号 事件 的 镶嵌 图 的 生成 过 程 ( 见 彩 图 ) 


镶 能 图 生成 过 程 中 划分 各 方块 所 依据 的 属性 顺序 可 以 根据 实际 需求 进行 调整 ， 读者 可 以 尝 
试 各 种 不 同 的 排列 顺序 ( 见 本 章 习 题 )。 如 果 想 对 镶 风 图 做 进一步 的 了 解 或 查看 更 多 的 例子 
(Friendly, 2000) ， 可 以 访问 Friendly (2000) 的 网 站 。 

5. 图 标 

对 象 可 见 性 是 数据 描述 技术 的 特性 之 一 ， 对 单个 对 象 的 清晰 描述 有 助 于 对 其 属性 做 定性 或 
定量 的 分 析 。 我 们 在 这 里 主要 讨论 两 个 例子 ， 其 中 一 个 例子 最 初 是 用 做 地 质 样本 特征 描述 ， 另 
一 个 则 是 用 于 住房 选择 。 

斯 坦 福 大 学 的 统计 学 家 Chernoff 教 授 发 现 人 类 对 很 多 面部 特征 非常 敏感 ， 因此 建议 将 表情 
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特征 如 眼睛 大 小 和 鼻子 长 度 (他 标明 了 18 种 不 同 的 类 型 ) 等 特征 加 入 到 卡通 人 脸 中 ， 从 而 形成 
一 个 有 效 的 编码 机 制 ( 见 图 3-62)。 他 将 这 个 想法 实践 于 地 质 样本 的 研究 中 (Chernoff, 1973), 
每 个 样本 有 诸如 水 分 或 盐分 等 18 个 属性 。 他 发 现 所 谓 的 Chernoft 脸 有 助 于 对 感 兴趣 样本 组 的 识 
别 。 如 果 会 计 师 等 工作 作风 严谨 的 用 户 想 要 使 用 这 样 较为 随意 的 计算 机 生成 的 卡通 脸 ， 那 么 他 
们 必须 在 此 之 前 就 已 经 掌握 了 用 Chernoff 脸 来 展示 会 计数 据 的 方法 (Stock and Watson, 1984), 
考虑 到 用 户 可 能 希望 某 个 属性 比 其 他 属性 拥有 更 多 的 细节 信息 (Morris et al., 1999), De Soete 
(1986) 为 各 种 面部 表情 特征 设 定 了 相对 值 。Ware (2004, page 253) 认为 需要 用 到 中 性 硬件 来 
处 理 脸 部 特征 。 


| | | 


图 3-62 Chernoff 险 将 属性 编码 融和 人 到 卡通 脸 的 特征 中 


在 购买 住房 的 例子 中 ， 图 3-63 所 示 的 多 维 图 标 旨 在 对 属性 进行 更 为 直接 的 描述 ， 例 如 用 船 
形 图 标 表 示 一 栋 船 屋 ， 用 内 含 一 个 汽车 图 标的 矩形 表示 车 库 。 该 多 维 图 标 描 述 了 住房 的 8 种 属 
性 。 读 者 也 许 会 马上 想到 一 个 问题 ， 这 样 的 多 维 图 标 是 否 比 图 3-64 所 示 的 常见 的 文字 描述 更 有 
用 呢 ? 为 了 研究 这 个 问题 ，Spence 和 Parr (1991) 进行 了 对 比 实验 ， 实 验 要 求 参与 者 完成 一 系 
列 给 定 的 任务 ， 下 面 是 其 中 一 个 代表 性 任务 ; 

你 的 住房 预算 最 多 为 200 000 英 镑 。 综 合 考虑 房间 数 和 花园 面积 ， 选 择 一 栋 你 觉得 最 合适 
的 住房 ， 但 前 提 是 该 住房 一 定 要 有 中 央 供 暖 设 备 。 


独 栋 住 房 

400 000 英 镑 300 000 英 镑 

有 车 库 无 车 库 

PRR 中 央 供暖 

4 个 房间 2 个 房间 

维修 状态 好 维修 状态 好 

大 花园 小 花园 

车 程 15 分 钟 车 程 20 分 钟 车 程 15 分 钟 





图 3-64 图 3-63 所 示 住 房 的 文字 性 描述 


实验 参与 者 面 对 两 种 情形 ，56 栋 住房 的 详细 情况 均 用 图 3-63 所 示 的 多 维 图 标 和 图 3-64 所 示 
的 文字 描述 加 以 表示 。 为 了 保证 数据 显示 的 一 致 性 ， 在 这 两 种 设置 下 ， 所 有 房屋 均 显 示 在 一 个 
7 x 8 的 矩阵 中 (图 3-65)。 结 果 显 示 用 图 标 进行 住房 选择 所 耗费 的 时 间 大 约 是 基于 文字 方法 所 
耗费 的 时 间 的 一 半 。 通 过 对 用 户 行为 的 观察 ， 研 究 者 发 现 相对 于 打印 在 纸 上 的 数据 ， 交 互 式 界 
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面 应 该 提供 某 些 标记 功能 ， 例 如 允许 用 户 做 “忽略 ”或 “考虑 ”等 标记 以 起 到 简化 任务 的 作用 。 
在 纸 质 设置 中 ， 参 与 者 用 图 钉 来 实现 标记 功能 。 


| 天 和 
图 3-65 在 图 标 和 文字 描述 两 种 设置 下 ， 对 所 有 住房 使 用 相同 的 住房 陈列 样式 


我 们 已 经 讨论 了 两 种 隐喻 式 图 标 : 在 购买 住房 一 例 中 ， 图 标 和 对 象 有 着 直接 的 联系 ， 而 人 
脸 图 中 的 面部 表情 和 地 质 属性 之 间 没 有 直接 联系 。Siirtola (2005) 发 现 用 户 更 偏爱 和 数据 相 
关 的 字形 (glyph， 即 图 标 )， 使 用 这 种 描述 获取 到 的 信息 精度 将 提高 13%。 直 接 的 隐喻 式 图 标 
有 着 广泛 的 应 用 (详情 可 参见 参考 文献 (Miller and Stasko, 2001))。 

6. 对 象 及 属性 可 见 性 

现在 我 们 回 过 头 来 看 看 在 前 面 编码 技术 的 讨论 中 提 到 过 的 可 见 性 这 一 概念 (Teoh and Ma, 
2005) ©, 

我 们 认为 对 象 可 见 性 的 实质 是 将 每 个 对 象 描述 为 一 个 单独 而 一 致 的 视觉 单元 (比如 一 个 
点 )。 当 用 户 对 对 象 在 多 个 维 数 上 的 属性 值 以 及 对 象 间 的 差异 感 兴趣 时 ， 就 需要 用 到 对 象 可 见 
性 。 支 持 对 象 可 见 性 的 例子 有 Chernoff 脸 、 多 维 图 标 和 星 形 图 (图 3-66)。 由 于 静态 平行 坐标 
图 中 的 对 象 被 描述 为 一 组 由 线段 连接 起 来 的 点 ， 很 难 找到 某 个 特定 对 象 的 属性 值 或 观察 不 同 对 
象 间 的 联系 ， 因 此 在 这 里 我 们 没有 将 其 纳入 支持 对 象 可 见 性 的 技术 范畴 。 





图 3-66 支持 对 象 可 见 性 的 多 属性 数据 描述 方法 ( 见 彩 图 ) 


我 们 对 属性 可 见 性 (也 叫 维度 可 见 性 ) 的 定义 和 对 象 可 见 性 类 似 。 在 支持 属性 可 见 性 的 描 
述 中 ， 对 象 属性 值 的 分 布 应 该 是 清晰 的 。 当 用 户 期 望 看 到 多 个 对 象 在 某 个 属性 维度 上 的 清晰 分 


日 我 们 用 “可 见 性 ”一 词 代 替 Teoh 和 Ma 提出 的 “一 致 性 ”一 词 。 


60 
l 
68 
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布 时 (例如 当 存 在 族群 (cluster) 时 )， 系 统 应 该 支持 属性 可 见 性 。 属 性 浏览 器 以 及 平行 坐标 
图 (图 3-67) 支持 属性 可 见 性 ， 而 Chernoff 脸 、 多 维 图 标 和 星 形 图 则 不 然 。Teoh 和 Ma (2005) 
提出 了 对 象 关联 性 (object correlation) 和 属性 (#8) 关联 性 (attribute/dimension 
correlation) 的 概念 。 在 平行 坐标 图 中 ， 相 邻 轴 上 的 点 通过 线段 连接 起 来 ， 清 晰 地 显示 了 它们 
之 间 的 相对 性 或 关联 性 ， 这 是 属性 关联 性 的 一 个 很 好 的 体现 。 属 性 关联 性 还 可 以 通过 星 形 图 等 
描述 加 以 实现 。 





图 3-67 支持 属性 可 见 性 的 多 属性 数据 描述 ( 见 彩 图 ) 


虽然 可 见 性 和 关联 性 是 两 个 比较 新 的 概念 ， 相 关 研 究 也 尚未 完善 ， 但 它们 的 有 用 性 是 显 而 
易 见 的 ， 并 且 和 前 面 讨论 过 的 如 何 使 事物 凸显 的 技术 相关 。 


3.2 关系 编码 


在 前 面 的 讨论 中 我 们 已 经 了 解 到 了 两 种 数据 类 型 的 存在 : 数值 (value) 和 关系 (relation) 。 
我 们 已 经 讨论 了 对 数值 的 各 种 编码 方法 ， 对 于 “关系 ”我 们 需要 回答 两 个 问题 : “HARKS 
什么 ? ”以 及 “我 们 如 何 对 关系 进行 编码 ?”。 

关系 的 字典 定义 如 下 : 

XR: 两 个 或 两 个 以 上 事物 之 间 的 逻辑 或 自然 联系 ， 互 相 之 间 的 相关 性 ， 连 接 。 

两 个 或 两 个 以 上 事物 之 间 的 关系 可 以 通过 很 多 不 同 的 方式 进行 描述 。 例 如 ， 可 以 利用 (一 
条 ) 简单 的 直线 来 表示 John Smith 和 Mary Robinson 之 间 的 婚姻 关系 (3-68), 或 者 John 向 
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Stingy 银 行 借 钱 买 了 辆 1930 年 产 的 宾利 车 (图 3-69)。 关 系 可 以 符合 某 个 数学 公式 y = SO), M 
而 表示 为 一 个 有 向 图 (图 3-70) 。 在 第 2 章 中 我 们 已 经 讨论 过 ， 一 辆 汽车 和 它 的 价格 之 间 的 关系 
可 以 通过 相同 的 颜色 加 以 表现 (图 3-71)。 图 3-72 总 结 了 公元 550 年 一 700 年 间 在 英格兰 Anglo- 
Saxon 地 区 发 生 的 战事 。( 对 我 而 言 ) 这 个 描述 比 文字 更 有 效 ， 例 如 ， 它 清晰 地 表明 了 西部 
Saxon 人 好 战 的 本 质 (Arnold, 1997) 以 及 Briton 人 在 很 长 一 段 时 间 内 被 频繁 侵略 的 事实 。 颜 色 
和 线条 粗细 为 关系 编码 提供 了 更 多 的 机 会 。 





图 3-68 一 个 简单 的 符号 就 可 以 表示 婚姻 关系 


John Stingy Bank 


1390 Bentley 





图 3-69 用 线段 表示 关系 


© © © © O 
o [ae IL 








图 3-71 用 颜色 表示 关系 ( 见 彩 图 ) 


我 们 通过 关系 处 理 离散 而 非 连续 的 属性 : 一 辆 汽车 可 以 有 很 多 个 不 同 的 价格 ， 但 一 家 旅馆 
要 么 拥有 要 么 没有 游泳 池 ， 为 了 购买 一 辆 宾利 车 ， 我 要 么 向 A 银行 要 么 向 B 银 行 贷款， 一 村 诈 
骗 案 的 嫌疑 人 要 么 在 洛杉矶 要 么 在 其 他 城市 受审 。 我 们 在 这 里 谈 到 的 都 是 二 值 属性 。 由 于 数值 
通常 有 多 于 两 个 的 情况 ， 因 此 毫 无 意外 的 ， 对 关系 进行 编码 将 使 用 到 和 数值 编码 不 同 的 技术 。 
然而 , 最 终 使 用 何 种 技术 进行 关系 编码 , 需要 考虑 的 因素 和 数值 编码 一 样 : 包括 对 任务 的 理解 、 
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需要 从 中 提取 的 信息 启示 ， 以 及 针对 关系 的 可 能 需要 回答 的 问题 。 


lsle of Wight 
Kent 
Britons 





图 3-72 公元 550 年 一 700 年 间 在 英格兰 Anglo-Saxon 地 区 发 生 的 战事 。 红 色 表 示 侵 略 者 ， 绿 色 表 示 
被 侵略 者 。 图 片 来 源 ，After Amold (1997) ( 见 彩 图 ) 


我 们 首先 介绍 一 些 简单 但 非常 有 效 的 关系 编码 方法 以 及 可 以 从 中 获取 的 信息 启示 。 正 如 上 
面 的 定义 所 强调 的 ， 关 系 存在 于 两 个 或 多 个 事物 中 ， 因 此 要 想 描述 关系 ， 首 先 必须 对 有 关系 的 
这 些 事物 进行 描述 。“ 事 物 描述 ”和 “关系 描述 ”二 者 必须 综合 考虑 。 


3.2.1 线段 


对 两 个 事物 关系 的 最 简单 的 描述 恐怕 就 是 在 这 两 个 事物 的 描述 体 间 加 上 一 条 线段 。 即 使 只 
是 用 简单 的 结 点 连接 图 (图 3-73b) 也 能 使 对 一 段 很 短 的 电话 记录 (图 3-73a) 的 理解 变 得 容易 。 
特别 当 不 相关 的 子 集 分 别 独立 显示 (图 3-73c) 时 ， 数 据 的 可 读 性 大 大 地 提高 了 。 结 点 连接 图 
对 于 第 1 章 中 提 到 的 抵押 诈骗 案 的 调查 非常 有 效 。 大 量 房 屋 购 买 交 易 涉及 借贷 方 、 法 律 顾问 、 
检察 员 等 多 种 角色 之 间 复 杂 的 关系 。 在 图 3-74a 所 示 的 描述 中 ， 每 个 有 关 个 体 或 机 构 被 描述 为 
环 面 上 的 一 个 片段 (图 3-74b) 。 内 圆 中 的 模式 本 身 并 不 能 提供 太 多 有 用 的 信息 ， 但 如 果 通 过 冰 
值 限制 将 正常 的 房屋 购买 交易 滤 掉 ， 则 该 描述 (图 3-75) 可 以 为 调查 者 提供 证 据 ， 从 而 帮助 锁 
定 参与 诈骗 的 嫌疑 人 (Davidson, 1993; Westphal and Blaxton, 1998), 


发 起 者 接收 者 
A H 
C L 
| M 
B E 
F H 
G i 
l B 
B M 
K B 
G B 
K E 
c J 
D c 





a) 


图 3-73 结 点 连接 图 (图 3-73b) 有 助 于 从 一 段 很 短 的 电话 记录 (图 3-73a) 中 获取 信息 启示 。 特 别 
当 不 相关 的 子 集 分 别 独立 显示 (图 3-73c) 时， 数据 的 可 读 性 大 大 地 提高 了 
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法 律 顾问 


会 计 


a) 抵押 贷款 活动 的 描述 。 借 贷方 、 房 屋 属性 、 购 买 者 等 多 个 角色 被 描述 为 环 面 上 的 一 个 
片段 ( 见 图 3-74b)。 它 们 之 间 的 关系 用 线段 标明 


申请 人 





b) 申请 人 表示 为 图 3-74a 所 示 的 贷款 活动 描述 中 的 放射 状 片段 
图 3-74 对 抵押 贷款 活动 的 描述 ( 见 彩 图 ) 


在 过 去 的 二 十 年 间 对 人 、 事 物 和 机 构 间 的 关系 描述 的 价值 已 得 到 充分 的 重视 ， 已 经 出 现 了 
很 多 强大 的 可 视 化 工具 用 以 支持 智能 分 析 领 域 中 的 各 种 任务 。Analyst's Notebook (i2, 2006) 
是 个 很 好 的 例子 ， 它 被 广泛 应 用 于 法 律 强制 执行 和 法 庭 调查 。 这 类 可 视 化 软件 允许 在 复杂 环境 
下 以 视觉 的 方式 对 数据 的 查询 、 对 看 似 不 相关 数据 的 分 析 ， 以 及 可 执行 智能 的 通信 等 。 有 些 调 
查分 析 的 首要 兴趣 是 人 、 社 交 网 络 、 地 点 和 属性 之 间 的 关系 ， 在 这 种 情况 下 可 以 使 用 如 图 3-76 
所 示 的 “联系 ”图 。 如 果 侧 重 于 对 事件 的 时 间 性 分 析 并 想 从 中 获取 一 般 联 系 图 中 难以 发 现 的 可 
能 的 时 间 巧 合 ， 则 可 使 用 图 3-77 所 示 的 “时 间 线 ”图 表 。 
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| 注意 模式 是 如 何 产生 的 ， 其 中 涉及 
| * 、+、# 和 |! 等 符号 | 










申请 人 


法 律 顾问 


Jf Gii 检察 员 
房产 经 纪 | 


会 计 
图 3-75 在 图 3-74 所 示 的 描述 中 加 上 阔 值 限制 将 正常 的 房屋 购买 行为 滤 掉 。 不 正常 的 购买 行为 通 
过 连接 的 线段 得 到 凸显 〈 见 彩 图 ) 


Al-Qaeda Bombings of the =". 
US Embasay Nairobi and the POP 
US Embassy Dar Es Salaam 一 本 一 g = o 
August 7, 1998 ani = 
~ = Be t Bez 8 
= == b == > 
b a = oe ZE B 
eee zr =: z at 
a Te 7 
Soe ES Fe = 





图 3-76 描绘 非洲 爆炸 案 的 关系 图 表 (图 片 感谢 i2 Ltd. 惠 允 ) 


伦敦 地 铁 示意 图 可 能 是 大 家 最 熟悉 的 用 线条 描述 关系 的 实例 (图 3-78) ， 它 反映 了 在 关系 
定义 中 提 到 的 “相关 性 ”"。 这 种 描述 方法 非常 有 效 ， 现 在 世界 上 所 有 的 交通 机 构 几 平 都 使 用 了 
这 种 描述 方法 (Ovenden, 2003)。 毫 无 疑问 ， 这 种 描述 受益 于 连接 各 站 点 的 线段 所 形成 的 形状 
(Harry Beck 实 际 上 可 能 受到 了 电路 设计 图 的 影响 )、 用 颜色 表示 的 不 同 路 线 ， 以 及 用 符号 标明 
的 普通 和 中 转 站 点 (Garland, 1994) 。 很 多 时 候 用 背景 色 来 表示 不 同 区 间 的 交通 资费 标准 。 这 
种 地 图 描述 法 的 另 一 个 优势 在 于 其 表达 的 地 理 信息 (虽然 不 需要 非常 精确 ) : 即使 站 台 间 的 距 
离 和 实际 地 理 距 离 没 有 精确 对 应 也 不 会 产生 太 大 问题 ， 但 如 果 将 位 于 伦敦 北部 的 、 因 足球 而 出 
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名 的 Wembley 放 在 地 图 下 方 ， 或 者 将 位 于 伦敦 南部 的 、 因 网 球 而 出 名 的 Wimbledon 放 在 地 图 上 
方 ， 都 将 显著 降低 地 图 的 价值 。 虽 然 没 有 找到 相关 的 可 用 性 测试 ， 但 当前 地 图 第 一 眼看 上 去 会 
比 Harry Beck 地 图 之 前 的 设计 (图 3-79) 更 容易 理解 。 


re 一 ee eee Se a Hee Py Pe 
Em pa me ma ee MR a we me ol Ee wn nr pe pp, me, EP Ye | 
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关系 一 词 通常 意味 着 用 户 之 间 的 交互 。 我 们 对 族谱 树 应 该 是 很 熟悉 的 ， 树 中 的 关系 通过 婚 
姻 、 小 孩 的 出 生 或 死亡 等 已 有 事件 得 以 建立 。 简 单线 段 的 使 用 可 以 推广 到 对 Freeman (2000, 
2005) 所 定义 的 “社会 动物 的 社会 性 本 质 的 结果 ”的 描述 。 对 社交 网 络 的 分 析 主 要 关注 连接 
社会 参与 者 的 结构 性 模式 。 我 们 主要 对 两 类 模式 感 兴 趣 : 1) 揭示 不 同 社会 群体 的 模式 ，2) 揭 
示 个 人 社会 地 位 或 角色 的 模式 。 

对 社交 网 络 的 描述 并 非 一 个 很 新 的 课题 : Moreno (1934) 早 在 70 年 前 就 提出 了 社交 网 络 
的 概念 : 图 3-80 显 示 了 一 个 学 校 中 四 年 级 学 生 的 社交 选择 结果 。 图 中 清晰 地 显示 了 他 们 倾向 于 
选择 同性 朋友 的 趋势 (如果 现在 再 对 这 个 相同 课题 做 一 次 调查 ， 也 许 会 得 到 有 趣 的 结果 ! ) 。 
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Freeman 的 同事 Marbella Canales (2005) 对 一 家 商场 的 化 妆 品 部 门 职员 的 娱乐 社交 联系 做 了 调 
查 ， 发 现 了 职员 间或 多 或 少 的 线性 关联 (图 3-81a) ， 这 种 关系 很 明显 并 非 随机 产生 的 ， 而 是 遵 
循 一 定 规律 (Freeman, 2005)。 为 了 进一步 揭示 这 种 规律 ， 她 根据 每 个 个 体 的 特点 ， 如 性 别 、 
宗教 信仰 、 婚 姻 状态 等 可 能 影响 社会 娱乐 伙伴 选择 的 因素 ， 对 图 中 的 结 点 分 别 进行 着 色 。 多 数 
时 候 着 色 结果 是 不 可 用 的 ， 例 如 图 3-81b 用 婚姻 状态 对 结 点 着 色 : 已 婚 人 士 用 黄色 表示 ， 单 身 
人 士 用 红色 表示 。 由 于 红色 和 黄色 分 散在 整个 图 中 ， 很 明显 地 说 明了 社会 娱乐 伙伴 的 选择 不 是 
由 婚姻 状态 所 决定 的 。 当 研究 者 依据 年 龄 进行 着 色 时 ， 一 幅 与 众 不 同 的 图 出 现 了 (图 3-81c): 
蓝 色 表 示 年 龄 低 于 30 岁 的 雇员 ， 黄 色 表 示 年 龄 在 30 一 40 岁 的 雇员 ， 红 色 表 示 年 龄 大 于 40 岁 的 
雇员 。 结 点 间 的 关联 性 说 明 雇 员 倾 向 于 选择 年 龄 相近 的 同事 作为 社会 娱乐 伙伴 。 
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图 3-80 四 年 级 学 生 的 社交 选择 示意 图 (Moreno, 1934) 
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a) 部 门 雇员 的 社会 选择 。( 图 片 来 源 ， 感 谢 L. C. Freemani f) 


74 
78 





c) 部 门 雇员 的 社会 选择 ， 颜 色 编 码 表示 不 同 的 年 龄 段 
( 蓝 色 <30，30< 黄 色 <40， 红 色 >40)。{ 图 片 来 源 : 感谢 L. C. Freemani ft) 


图 3-81 部 门 雇员 的 社会 选择 ( 见 彩 图 ) 


3.2.2 图 和 图 表 


1. 维 思 图 

关系 的 定义 特别 指出 它 反 映 了 “逻辑 联系 ”。 表 3-2 显 示 了 非常 简单 的 逻辑 关系 ， 例 如 B 酒 
店 有 游泳 地 和 高 尔 夫 球场 ， 但 是 没有 餐厅 。 在 一 张大 得 多 的 表格 中 寻找 满足 条 件 的 酒店 是 非常 
耗 时 的 ， 但 如 果 在 维 恩 图 (Venn diagram) 里 来 做 这 个 操作 就 会 简单 很 多 。 图 3-82 是 和 表 3-2 对 
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应 的 维 恩 图 。 图 3-83 是 一 个 大 得 多 的 包含 24 家 酒店 的 维 恩 图 ， 它 也 许可 以 帮助 旅行 者 快速 地 找 
到 符合 需求 的 酒店 。 例 如 ， 如 果 客 户 要 求 酒店 配备 所 有 的 设施 〈 游 泳池 + 高 尔 夫 球场 + 餐厅 ) ， 
则 有 4 家 酒店 可 供 选 择 。 在 维 思 图 中 加 入 交互 是 很 有 用 的 。 


表 3-2 8 家 酒店 提供 的 各 项 设施 


DKA 高 尔 夫 球场 餐厅 
A e @ o 
B @ e 
€ e © 
酒店 D © 
E 6 e 
F ( 
G o 





图 3-82 和 表 3-2 对 应 的 维 思 图 


高 尔 夫 球 场 
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图 3-83 包括 24 家 酒店 设施 的 维 恩 图 
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2. 信息 水 晶 图 

Spoerri (1993) 提出 了 一 种 对 维 恩 图 的 改进 方法 以 加 强 对 逻辑 关系 的 描述 。 图 3-84 显 示 了 
从 一 个 包含 三 个 属性 的 维 恩 图 到 信息 水 晶 图 (InfoCrystal) 的 转换 过 程 。 三 个 属性 间 所 有 可 能 
的 逻辑 关系 都 表示 为 信息 水 晶 图 中 的 面积 。 图 3-84 使 用 了 同 图 3-58 中 属性 浏览 器 类 似 的 住房 颜 
色 编 码 ， 例 如 星 号 表示 满足 价格 和 花园 面积 要 求 但 不 满足 房间 数 条 件 的 住房 ， 它 也 可 以 作为 一 
种 选择 方式 (例如 视觉 查询 )。Spoerri 还 在 图 3-84 所 示 的 描述 中 加 入 了 一 些 内 部 图 标 (图 3-85)。 
这 些 图 标的 形状 表示 了 满足 的 条 件数 ( 圆 =1， 和 矩形 =2， 三 角形 =3)， 图 标 内 的 数字 表示 符合 对 
应 条 件 的 酒店 数 。 因 此 对 于 图 3-83 所 描述 的 24 家 酒店 ， 其 中 有 4 家 满足 所 有 条 件 ， 有 高 尔 夫 球 
场 和 餐厅 但 没有 游泳 池 的 只 有 一 家 。Spoerri 的 信息 水 晶 图 可 以 扩展 到 多 于 三 个 属性 的 情况 。 
但 是 多 于 四 个 属性 的 信息 水 唱 图 描述 可 能 只 有 专业 用 户 才能 胜任 理解 和 查询 等 任务 。 





图 3-84 从 一 个 包含 三 个 属性 的 维 恩 图 到 信息 水 晶 图 的 转换 过 程 。 图 中 所 示 的 信息 水 晶 图 允许 关 
于 价格 、 花 园 面积 和 房间 数 的 视觉 查询 ( 见 图 3-58 显 示 的 属性 浏览 器 ) 。 星 号 表示 满足 价 
格 和 花园 面积 要 求 但 不 满足 房间 数 条 件 的 住房 〈 见 彩 图 ) 


游泳 池 高 尔 夫 球场 


© CI © 
ety 


餐厅 
图 3-85 对 图 3-83 所 示 的 酒店 数据 的 信息 水 晶 图 描述 
3. 族群 图 
图 3-86 是 和 图 3-83 所 示 的 维 因 图 以 及 图 3-85 所 示 的 信息 水 晶 图 内 容 一 致 的 族群 图 (cluster 
map, Fluit et al., 2003)。 三 个 带 标签 的 结 点 分 别 表示 三 个 属性 ， 后 面 的 数字 表示 符合 该 属 性 条 


fE (如 有 和 餐厅 ) 的 酒店 数 。 注 意 ， 由 于 存在 满足 多 个 条 件 的 酒店 ， 因 此 三 个 标签 内 的 数字 的 总 
和 不 等 于 酒店 总 数 24， 例 如 同时 拥有 餐厅 和 游泳 池 的 酒店 会 为 “游泳 地 ”和 “休息 ”标签 各 贡 
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献 1 分 。 每 个 标签 和 一 个 或 多 个 圆 相连 ， 圆 内 的 黄色 球 代表 酒店 。 根 据 每 个 酒店 满足 的 条 件 ， 
它们 被 放置 到 不 同 的 圆 内 。 例 如 ，E 酒 店 只 拥有 餐厅 ， 因 此 被 放 人 只 和 “餐厅 ”标签 相连 的 圆 
内 。B 酒 店 有 且 仅 有 游泳 地 和 高 尔 夫 球场 ， 因 此 被 放 到 和 “游泳 地 ”、“ 高 尔 夫 球场 ”标签 同时 
相连 的 圆 内 。 从 图 3-86 的 族群 图 中 可 以 清晰 地 看 到 不 存在 有 游泳 池 和 餐厅 但 没有 高 尔 夫 球场 的 
酒店 。 通 过 鼠标 悬 停 可 以 查看 每 个 酒店 的 详细 信息 。 


B 
=D g 


T (13) 





ae 


图 3-86 和 图 3-83 所 示 的 维 恩 图 以 及 图 3-85 所 示 的 信息 水 晶 图 内 容 一 致 的 族群 图 (图 片 感谢 
Christiaan Fluit, Aduna 惠 允 ) ( 见 彩 图 ) 


描述 逻辑 数据 的 可 视 化 技术 的 测试 标准 主要 是 看 它 对 多 属性 的 扩展 性 。 图 3-87 显 示 了 族群 图 
在 这 个 方面 的 能 力 : 图 中 共 显示 了 拥有 4 个 属性 的 24 家 酒店 。 图 中 不 存在 只 和 “健身 房 ”标签 相 
连 的 圆 ， 说 明 所 有 有 健身 房 的 酒店 都 至 少 有 其 他 三 种 设施 中 的 一 种 。 族 群 图 支持 各 种 交互 ， 如 高 
显 和 某 个 标签 相连 的 圆 ， 以 及 用 动画 来 描述 增加 一 个 新 类 别 后 族群 图 的 变化 (Fluit et al., 2003) 。 


餐厅 (13) 


Sho 


图 3-87 显示 有 4 个 属性 的 24 家 酒店 的 族群 图 (图 片 感谢 Christiaan Fluit, Aduna ft) ( 见 彩 图 ) 
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3.2.3 树 的 描述 

以 上 讨论 的 所 有 例子 中 均 没 有 严格 限制 相连 的 事物 。 “网络 ”一 词 经 常用 于 描述 结 点 一 联 
系 类 型 的 关系 ， 对 拓扑 结构 没有 严格 的 限制 ， 例 如 图 3-73 描 述 的 简单 网 络 以 及 图 3-74 所 示 的 
复杂 得 多 的 抵押 贷款 数据 。 有 些 网 络 图 中 应 用 了 拓扑 限制 ， 由 此 产生 了 一 类 新 的 网 络 描述 方 
法 : 树 。 

树 的 数学 定义 是 由 结 点 和 结 点 间 联 系 组 成 的 不 含 回路 的 网 络 。 换 名 话说， 如 果 没 有 回 湖 操 
作 ， 从 树 中 某 个 结 点 出 发 的 路 径 不 能 回 到 该 结 点 。 由 于 树 描述 了 等 级 关系 ， 因 此 该 描述 方法 具 
有 广泛 的 应 用 价值 。 我 们 通过 图 3-88 所 示 的 简单 的 树 来 介绍 相关 术语 。 树 中 某 个 结 点 被 指定 为 
根 结 点 。 我 们 在 这 里 之 所 以 使 用 “指定 ”一 词 是 因为 树 中 的 任何 一 个 结 点 都 可 以 被 设 定 为 根 结 
点 。 在 实际 应 用 中 ， 树 通常 表示 等 级 关系 ， 其 中 的 根 结 点 表示 公司 或 由 多 条 产品 生产 线 组 成 的 
部 门 负责 人 。 如 果 等 级 结构 存在 ， 则 除根 结 点 外 ， 其 余 结 点 都 有 一 个 前 驱 结 点 ， 这 些 结 点 叫 前 
驱 结 点 的 “和 孩子"。 没 有 后 继 结 点 的 结 点 叫 “叶子 结 点 o 


ee 







A 结 点 的 父 结 点 


ra 


A 结 点 的 兄弟 结 点 
ra 


叶子 结 点 
所 一 一 A 结 点 的 孩子 结 点 


bo 


叶子 结 点 
图 3-88 树 的 示意 图 


如 果 数 据 是 树 结构 的 ， 则 我 们 会 马上 想到 如 何 对 该 数据 做 有 用 的 描述 和 探查 。 图 3-88 所 示 
的 描述 有 问题 吗 ? 如 果 不 存在 问题 的 话 ， 那 我 们 也 不 必 进 行 下 面 的 讨论 了 。 

1. BAG h 

图 3-88 所 示 的 树 描述 存在 一 个 问题 ,实际 应 用 中 树 可 能 有 很 多 层 。 即 使 度 (和 某 个 结 点 相 
连 的 孩子 结 点 的 数目 ) 只 有 3， 表 示 一 棵 树 所 需 的 空间 特别 是 水 平方 向 上 的 空间 可 能 还 是 会 很 
大 。 一 种 解决 方法 是 对 原始 的 树 (图 3-89a) 进行 三 维 重 排 ， 将 具有 相同 父 结 点 的 所 有 结 点 放 
在 一 个 水 平 圆 上 。 这 个 圆 和 父 结 点 一 起 共同 形成 了 一 个 锥 形 (如 图 3-89b 所 示 )。 对 该 结构 的 二 
维 视图 叫做 锥 形 树 (cone tree, Robertson et al., 1991) ， 它 比 图 3-89a 中 的 原始 描述 更 为 紧凑 。 
锥 形 图 中 可 能 存在 的 位 置 冲 突 是 比较 容易 处 理 的 。 用 户 可 能 想 看 到 锥 形 图 中 某 个 雇员 在 公司 中 
的 报告 路 径 , 这 可 能 涉及 对 该 树 做 旋转 , 将 该 职员 的 名 字 和 对 应 的 报告 路 径 显 示 在 视图 的 正面 。 
锥 形 图 在 水 平方 向 上 的 定位 叫 凸 轮 树 (cam tree) ， 这 种 描述 更 有 利于 显示 结 点 名 字 (图 3-90) 。 
目前 还 没有 对 锥 形 树 可 用 性 的 测试 报告 。 
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图 3-90 对 锥 形 图 做 重 排 有 利于 结 点 标签 的 显示 


2. 树 图 

树 图 (tree maps, John and Shneiderman, 1991) 是 树 的 另 一 种 描述 方式 。 从 图 3-91 中 可 以 
清晰 地 看 到 从 树 到 树 图 的 演变 过 程 是 直接 的 。 首 先 从 指定 的 根 结 点 开始 ， 画 一 个 经 过 根 结 点 的 
矩形 框 。 为 了 充分 利用 显示 区 域 ， 和 矩形 框 通 常会 尽量 画 得 大 一 些 。 在 这 个 和 矩形 框 内 有 很 多 小 矩 
É, 分别 表 示 从 属于 根 结 点 的 孩子 结 点 。 用 这 种 方法 遍历 树 中 所 有 的 结 点 ， 直 至 为 每 个 结 点 都 
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创建 一 个 对 应 的 矩形 。 除 显示 器 分 辨 率 外 ， 该 描述 法 没有 对 树 的 深度 做 限制 ， 也 不 要 求 所 有 叶 
子 结 点 位 于 同一 层 或 每 个 结 点 拥有 相同 的 度 。 创 建 好 树 图 之 后 ， 可 以 使 用 颜色 编码 来 区 分 树 的 
不 同 部 分 。 

图 3-91 显 示 了 树 图 创建 过 程 中 的 一 个 主要 问题 : 生成 的 树 图 中 可 能 含有 大 量 非 常 狭 窗 的 矩 
形 , 在 其 中 显示 文字 是 很 困难 的 。 这 个 问题 比较 好 解决 ， 可 以 利用 图 3-92 所 示 的 “切片 和 盘子 
(slice-and-dice) 法 : 相 邻 两 层 结 点 所 对 应 的 矩形 框 分 别 水 平和 垂直 地 交错 放置 。 图 3-93 显 示 
了 用 该 方法 描述 的 一 位 作家 的 作品 集 。 从 图 中 可 以 看 到 ， 树 图 的 优点 是 凸显 了 叶子 结 点 ， 缺 点 
是 不 容易 看 出 层次 关系 。 





对 应 的 树 图 


图 3-92 树 图 的 “切片 和 般 子 ”创建 过 程 。 该 方法 凸显 了 叶子 结 点 ， 更 适合 于 文字 和 图 片 的 显示 


树 图 有 着 非常 广泛 的 应 用 。 在 图 3-94 所 示 的 Smartmoney.com 网 站 上 ， 主 要 的 工业 行业 如 能 
源 、 医 疗 等 显示 为 矩形 , 矩形 内 部 的 各 方块 代表 相关 企业 。 可 以 大 量 使 用 颜色 编码 和 面积 编码 ， 
也 可 以 使 用 鼠标 悬 停 等 交互 技术 ， 或 者 通过 鼠标 点 击 查看 细节 信息 。 还 可 以 引入 第 4 章 中 将 要 
介绍 的 变形 和 抑制 技术 。 图 3-95 显 示 如 何 通过 改变 属性 范围 来 控制 树 图 视图 的 变化 ， 同 时 也 再 
一 次 显示 了 结合 各 种 技术 的 可 能 (Csallner et al., 2003), 
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图 3-94 Smartmoney.com 网 站 显示 了 各 行业 中 相关 企业 的 状态 ( 见 彩 图 ) 


3. 双 曲线 浏览 器 

1994 年 出 现 了 一 种 新 颖 的 树 的 描述 方法 ， 该 方法 可 以 将 整 棵 树 显示 在 传统 显示 器 上 的 某 个 
规定 大 小 的 圆 内。 我们 这 里 不 讨论 该 方法 所 涉及 的 复杂 的 数学 原理 (Lamping et al., 1995; 
Lamping and Rao, 1994, 1996) ,. 如 图 3-96 所 示 ， 利 用 双 曲 线 几 何 变换 ， 该 方法 可 以 保证 树 的 所 
有 结 点 都 被 放置 于 一 个 特定 区 域内 。 指 定 的 根 结 点 初始 时 位 于 区 域 中 心 ， 它 的 直接 后 继 结 点 以 
一 个 特定 距离 显示 在 它 周 围 。 随 着 层次 的 增加 ， 结 点 距离 根 结 点 的 位 置 变 远 ， 结 点 和 父 结 点 间 
的 距离 缩小 ， 结 点 变 小 ， 这 样 才 可 以 保证 所 有 结 点 都 显示 在 一 个 特定 区 域内 。 一 次 所 能 显示 的 
结 点 数目 取决 于 显示 器 的 分 辩 率 : 当 分 辩 率 低 于 一 个 像素 时 停止 树 的 绘制 。 
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EE 
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图 3-95 显示 经 济 信息 的 树 图 ， 人 允许 对 属性 进行 过 滤 (图 片 经 HIVE 惠 允 ) ( 见 彩 图 ) 





图 3-96 树 的 双 曲 线 浏览 器 描述 。 结 点 距离 根 结 点 越 远 ， 它 和 其 父 结 点 的 距离 越 近 ， 所 占用 的 空 
间 也 越 小 


双 曲 线 浏 览 器 最 主要 的 优势 在 于 交互 性 。 任 何 感 兴趣 的 结 点 都 可 以 平滑 地 移动 到 中 心 区 域 ， 
同时 它 的 后 继 结 点 也 向 相同 的 方向 移动 。 通 过 可 用 区 域内 树 的 这 种 平滑 移动 可 以 比较 容易 地 查 
看 感 兴趣 区 域 。 图 3-97a 显 示 一 个 虚构 部 门 雇员 的 双 曲 线 浏 览 器 : Rachel Anderson 朝 中 心 点 的 
平滑 移动 使 得 她 的 上 司 结 点 往外 移动 ， 同 时 凸显 了 直接 向 她 汇报 的 员工 (图 3-97b)。 同 样 的 ， 
Eliza Doolittle 朝 中 心 点 的 平滑 移动 也 可 以 凸显 直接 向 她 汇报 的 员工 信息 。 同 锥 形 图 类 似 (但 
不 同 于 树 图 )， 双 曲线 浏览 器 清晰 地 显示 了 层次 结构 。 和 树 图 不 同 的 是 ， 除 非 将 叶子 结 点 拖 向 
中 心 ， 否 则 叶子 结 点 在 双 曲 线 浏览 器 中 的 显示 不 明显 。 图 3-98 显 示 了 双 曲 线 浏览 器 在 美国 国会 
图 书馆 里 的 应 用 。 
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3-97 a) 一 家 公司 的 员工 汇报 结构 ，b) 当前 感 兴趣 的 员工 Rachel Anderson 向 中 心 移动 ， 使 得 
她 的 下 属 得 到 凸显 
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图 3-98 双 曲 线 浏览 器 在 美国 国会 图 书馆 里 的 应 用 


3.3 设计 支持 


即使 是 设计 最 简单 的 可 视 化 工具 也 需要 创造 力 。 如 同 传统 的 画家 有 颜料 一 样 ， 交 互 设 计 师 
也 有 一 系列 调 色 板 。 例 如 图 3-99a 所 示 的 调 色 板 上 显示 了 丰富 的 用 于 对 数值 和 关系 进行 编码 的 
可 用 技术 ， 每 种 技术 有 各 自 的 优 缺 点 。 图 3-99b 显 示 了 为 特定 应 用 选择 合适 的 描述 方法 时 需要 
考虑 的 各 种 因素 。 

有 效 的 交互 式 设计 还 需要 另外 两 个 调 色 板 。 一 个 是 第 4 章 将 详细 讨论 的 数据 显示 ， 它 主要 
关注 如 何在 有 限 的 空间 和 时 间 内 将 已 有 描述 呈现 出 来 。 另 一 个 调 色 板 是 第 5 章 中 将 会 介绍 的 交 
互 。 交 互 设计 师 可 以 自由 地 选择 所 需 概念 和 技术 ， 结 合 数据 描述 和 数据 显示 提高 信息 可 视 化 的 
效果 。 





a) b) 


图 3-99 可 供 交 互 设 计 师 选用 的 “ 调 色 板 ”": a) 技术 ，b) 概念 (RBM) 
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建议 通过 课堂 讨论 的 形式 来 加 深 对 以 下 习题 的 理解 。 


3.1 


3.2 


(复习 题 ) 列 出 所 有 你 能 回忆 起 的 数据 的 视觉 编码 方法 ， 并 写 出 各 自 适 合 的 实用 环境 。 
讨论 它们 的 静态 形式 〈 即 无 交互 的 状态 下 ) 是 否 支持 对 象 /属性 可 视 化 以 及 相关 性 。 
五 位 学 生 参 加 了 8 科 考 试 ， 每 科 成 绩 为 10 以 内 的 数字 。 列 出 至 少 10 个 以 下 不 同 角色 会 
对 成 绩 表 提出 的 问题 ，(a) 学 生 、(b) KK, (c) 学 科 老师 、(d) 年 级 主任 。 将 这 些 
问题 钉 在 题 板 上 作为 习题 3.3 的 参考 。 





3.3 习题 3.2 中 提 到 的 学 生成 绩 如 下 表 所 示 。 
5 位 学 生 (A, B,C,D,E) 的 8 科 成 绩 ， 成 绩 最 高 分 为 10 分 : 
ER 10 1 5 3 2 
科学 1 10 5 4 8 
历史 8 5 7 1 1 
运动 2 9 5 10 4 
物理 一 1 2 3 1 
英语 2 8 6 8 5 
化 学 4 1 1 1 4 
数学 10 1 5 4 2 
A B C D E 


不 考虑 计算 机 技术 及 任何 交互 功能 ， 给 出 该 数据 集 的 一 个 静态 描述 。 检 查 它 是 否 能 够 帮助 
回答 习题 3.2 中 提出 的 问题 。 
对 于 习题 3.2 中 答案 不 容易 找到 的 问题 ， 检 查 你 能 否 对 提出 的 描述 做 改进 (仍然 不 考虑 


交互 )。 


3.4 


3.5 


3.6 


3.7 
3.8 


3.9 


为 表 3-1 所 示 的 泰坦 尼克 号 事件 生成 一 个 镶 供 图， 注意 使 用 不 同步 又 (例如 ， 是 否 存 
活 一 性 别 一 舱位 等 级 一 成 年 人 /儿童 ) 。 列 出 能 从 这 些 描述 中 提取 出 的 信息 。 它 们 是 否 
和 图 3-58 所 示 的 描述 结果 一 致 ? 

伦敦 地 铁 地 图 没有 包含 任何 距离 或 旅行 时 间 信息 。 借 用 草图 的 方法 来 思考 如 何 将 这 些 
信息 以 及 其 他 可 能 纳入 的 信息 加 入 到 描述 中 。 

Florene Nightingale 的 “玫瑰 图 ” 初 看 和 星 形 图 很 类 似 。 分 析 它 们 的 区 别 ， 以 及 星 形 
图 的 封闭 区 域 能 显示 及 不 能 显示 的 信息 。 

通过 草图 设计 对 Google 搜 索 返 回 的 命中 信息 的 描述 方法 。 

为 你 所 在 学 校 或 部 门 《真实 或 虚构 均 可 ) 设计 一 个 学 术 成 绩 描述 (例如 五 年 级 学 生 的 
12 门 学 科 的 成 绩 ) 。 要 求 不 仅 显示 普通 成 绩 水 平 ， 还 要 显示 (1) 成 绩 的 变化 (如 一 
阶 导数 ) ，(2) 成 绩 及 格 的 学 生 数 ，(3) 参加 了 特定 课程 的 学 生 人 数 。 注 意 最 后 给 出 
的 描述 要 能 够 打印 在 可 携带 (例如 A4 大 小 ) 卡片 上 。 

以 下 列 出 的 是 本 章 中 没有 讨论 的 数据 描述 技术 ， 自 选 一 篇 认真 研读 ， 准 备 一 个 10 分 
钟 的 介绍 ， 讨 论 其 主要 特点 。 

(1) Keim, D.A., Hao, M.C., Dayal, U. and Hsu, M. (2002) Pixel bar charts: a 


visualization technique for very large multi-attribute data sets, 
Information Visualization, 1, 1, pp. 20-34. 


(2) Havre, S., Hetzler, E., Perrine, K., Jurrus, E. and Miller, N. (2001) 


3.10 


第 3 章 MH HR 71 


Interactive visualization of multiple query results, IEEE, Proceedings 
Information Visualization, pp. 105-112. 


(3) Yang, J., Ward, M.O. and Rundensteiner, E.A. (2002) InterRing: an 
interactive tool for visually navigating and manipulating hierarchical 
structures, IEEE, Proceedings Information Visualization, pp. 77-84. 


(4) Havre, S., Hetzler, B. and Nowell, L. (2000) Theme river: visualizing 
theme changes over time, IEEE, Proceedings Information Visualization 
2000, pp. 145-154. 

(5) Geons, as described in Colin Ware’s book Information Visualization: 


Perception for Design (2004). 


设计 对 人 际 关系 (包括 婚姻 状态 、 出 生日 期 、 死 亡 等 信息 ) 的 静态 ( 非 交 互 ) 描述 。 
用 实际 数据 加 以 测试 ， 分 析 其 优 缺点 。 

汽车 、 地 铁 和 火车 线路 通常 被 表示 为 用 线段 相连 的 结 点 。 然 而 ， 在 一 些 大 城市 Can 
伦敦 ) 里 ， 由 于 线路 众多 ， 尤 其 当 涉 及 中 转 线路 时 ， 计 划一 次 旅行 并 不 是 件 容易 的 
事 。 考 虑 如 何在 结 点 连接 图 中 加 入 指示 性 标识 ， 以 方便 线路 的 选择 。 

在 你 的 电脑 上 任意 选择 一 个 至 少 有 两 层 的 文件 夹 ， 为 其 画 出 对 应 的 树 图 描述 。 

在 你 的 电脑 上 任意 选择 一 个 至 少 有 两 层 的 文件 夹 ， 为 其 画 出 对 应 的 双 曲 线 浏览 器 描 
述 。 讨 论 此 描述 在 寻找 叶子 结 点 时 的 优 缺 点 。 

为 一 家 商店 、 一 个 部 门 、 多 本 书籍 、 菜 谱 或 照片 画 出 对 应 的 三 层 树 结构 描述 。 根 据 
结构 建立 一 个 树 图 。 注 意 讨论 遇 到 的 种 种 困难 。 
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数据 表示 


问题 

很 多 人 都 遇 到 过 这 样 一 个 问题 : 在 截止 日 期 前 必须 完成 一 份 报告 ， 直 接 导致 的 结果 就 是 
(图 4-1) 餐厅 里 可 坐 12 个 人 的 大 饭桌 上 堆 满 了 成 堆 的 报告 、 书 籍 、 简 报 甚至 旧 文 档 ， 地 板 和 椅 
子 可 能 也 用 来 堆放 文件 。 有 些 文件 甚至 堆放 在 其 他 文件 之 上 。 这 种 对 重要 信息 的 表示 是 有 道理 
的 : 相关 的 东西 都 放 在 手边 (希望 如 此 )， 这 些 东西 的 可 见 性 起 到 了 提示 作用 (Bolt, 1984; 
Malone, 1983) ， 它 们 的 空间 位 置 (Czerwinski et al., 1999) 提示 我 们 某 样 东 西 所 放 的 地 方 。 正 
是 由 于 这 样 的 视图 ， 我 们 才 可 以 获得 灵感 。 在 这 样 的 环境 中 我 们 可 以 将 精力 集中 于 创造 性 工作 


spent AT ila 









图 4-1 准备 报告 : 各 种 来 源 的 文件 随处 可 见 并 随手 可 得 


尽管 有 高 分 辨 率 的 显示 器 和 功能 强大 的 工作 站 , 我 依然 用 这 样 的 方式 来 完成 大 多 数 的 报告 。 
为 什么 ? 不 是 因为 任何 Luddite 趋 势 ， 而 是 由 于 典型 的 工作 站 所 提供 的 显示 区 域 实在 太 小 ， 不 
能 显示 所 有 和 我 工作 有 关 的 资料 。 

我 不 是 唯一 一 个 面临 资料 多 而 屏幕 小 问题 的 人 。 我 们 也 许 需 要 一 个 非常 大 但 同时 也 非常 昂 
贵 的 显示 器 才能 完全 显示 伦敦 地 铁 或 一 个 公司 组 织 树 形 图 的 所 有 细节 信息 。 如 果 我 们 只 有 一 部 
PDA 或 手机 ， 情 况 就 会 变 得 非常 糟糕 : 站 在 伦敦 的 一 条 大 街 上 ， 手 里 没有 地 图 ， 怎 样 才 能 有 效 
率 地 查看 伦敦 地 铁 的 信息 来 进行 旅行 策划 呢 ? 


数据 表示 


在 第 2 章 中 ， 我 们 将 显示 器 尺寸 不 够 大 的 问题 归结 为 “数据 表示 ”问题 。 现 在 我 们 要 给 它 
一 个 适当 的 定义 。 在 表示 的 诸多 定义 中 ， 其 字典 定义 如 下 : 

表示 : 提供 视图 ; 显示 。 

因此 ， 和 数据 的 描述 方式 无 关 ， 数 据 表示 关注 的 是 描述 如 何 得 到 显示 ， 如 何 呈 现 给 用 户 ， 
其 至 是 该 描述 是 否 应 该 得 到 显示 。 当 显示 区 域 的 大 小 受 限 时 ， 布 局 问题 就 出 现 了 。 当 然 ， 数 据 
描述 和 数据 表示 之 间 存在 着 内 部 联系 。 即 使 决定 了 数据 描述 的 表示 方法 ， 依 然 存在 是 否 对 数据 


第 4 章 数据 表示 "73 


表示 进行 交互 控制 的 问题 。 当 然 ， 这 些 决定 都 深 受 可 视 化 工作 所 要 支持 的 任务 影响 。 因 此 我 们 
有 必要 首先 讨论 数据 表示 以 及 和 数据 表示 的 交互 设计 相关 的 一 些 概念 。 


4.1 空间 局 限 
4.1.1 滚动 


当 文 件 大 小 大 于 显示 区 域 时 ， 滚 动 (scrolling) 是 一 个 明显 的 解决 方法 : 一 篇 很 长 的 文章 
可 以 滚动 过 一 个 窗口 直至 用 户 找到 相关 信息 〈 图 4-2)。 有 时 滚动 可 以 解决 问题 ， 但 在 很 多 情况 
下 它 并 非 一 个 有 效 的 解决 方法 。 例 如 ， 我 正在 写 第 2 章 的 第 3 节 (我 认为 是 这 样 的 ， 但 其 实 我 并 
不 能 看 到 最 后 一 节 的 标题 ) ， 我 想 查看 前 面 章节 的 某 一 幅 图 片 。 它 在 哪里 ? 我 必须 往 前 滚动 ， 
但 是 滚动 到 哪 ? 我 需要 费劲 地 查找 ， 在 此 过 程 中 对 当前 任务 的 记忆 可 能 逐渐 消退 ， 导 致 “我 刚 
经 过 哪儿 ”的 问题 出 现 ， 我 只 得 又 滚动 回 刚才 查看 过 的 地 方 。 使 用 微 胶片 的 用 户 肯定 能 马上 明 
白 这 个 场景 。 滚 动 的 主要 问题 在 于 大 多 数 内 容 在 当前 窗口 内 不 可 见 。 


Gea 
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图 4-2 滚动 使 得 文件 的 大 多 数 内容 在 当前 窗口 中 不 可 见 


4.1.2 总 图 + 细节 


滚动 的 一 个 不 足 之 处 是 不 能 同时 看 到 上 下 文 和 细节 信息 , 解决 方法 是 同时 显示 二 者 的 视图 。 
然而 在 通常 情况 下 没有 足够 的 空间 能 用 相同 的 分 辩 率 来 线性 地 显示 这 两 种 视图 。 两 个 单独 的 视 
图 〈 分 别 用 于 上 下 文 信息 和 细节 信息 的 显示 ) 可 以 构成 总 图 + 细节 (overview+detail) 的 显示 
方式 ， 该 方式 可 以 带 来 更 多 的 好 处 。 图 4-3 是 一 个 大 家 熟悉 的 例子 : 在 主要 页 面 中 显示 文件 中 
某 一 页 的 详细 信息 ， 在 旁边 一 栏 中 垂直 地 显示 每 一 页 的 缩 略 图 。 这 样 ， 用 户 可 以 根据 自己 的 速 
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度 和 判断 力 来 查看 细节 并 随时 保持 对 上 下 文 信息 的 关注 ， 并 且 注 意 力 可 以 很 方便 地 在 两 种 视图 
间 进 行 切 换 。 高 显 的 缩 略 图 提示 用 户 当 前 所 在 位 置 。 图 4-4 显 示 了 一 个 视频 编辑 工具 的 界面 。 
编辑 者 可 以 看 到 当前 关注 片段 的 上 下 文 信息 。 总 图 + 细节 的 表示 方法 将 内 容 分 割 为 可 理解 的 几 


个 部 分 ， 同 时 清晰 地 表明 了 它们 之 间 的 内 部 关系 。 
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图 4-3 总 图 + 细节 。 当 用 户 关注 PDF 文 档 的 某 一 页 的 细节 信息 时 ， 每 一 页 的 缩 略 图 为 用 户 提供 了 
有 用 的 上 下 文 信息 
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图 4-4 一 个 提供 总 图 + 细节 的 视频 编辑 工具 。 界面 上 方 的 8 个 视频 片段 显示 了 当前 视频 文件 的 总 图 ， 
当前 片段 得 到 高 显 。 左 下 方 显 示 当 前 编辑 部 分 的 总 图 信息 ， 右 边 显 示 所 选 时 间 点 对 应 的 视 


频 内 容 (图 片 感谢 Colin Grimshaw MK ft) 
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人 们 在 旅行 中 ， 特 别 是 自驾 游 时 ， 经 常会 用 到 总 图 和 细节 。 例 如 ， 一 个 来 自 英格兰 南部 的 
人 要 开车 到 北部 去 拜访 他 住 在 Halifax 的 姑姑 Mabel， 途 中 会 经 过 Huddersfield。 他 在 通过 
Huddersfield 地 区 时 需要 一 幅 详细 地 图 的 帮助 ， 并 且 他 始终 不 能 忘记 这 次 旅行 的 目的 是 到 达 
Halifax。 因 此 ， 我 们 会 看 到 他 (如常 是 很 紧张 的 ) 拿 着 两 幅 地 图 ， 一 幅 显示 详细 信息 ， 另 一 
幅 显 示 周 边 地 区 的 总 图 (图 4-5)。 可 能 的 改进 方法 是 添加 一 个 (真正 的 或 模拟 的 ) 放大 镜 
(图 4-6) 或 者 DragMag (Ware and Lewis, 1995)， 它 可 以 帮助 用 户 灵活 地 选择 任意 感 兴趣 区 域 
并 为 之 显示 一 个 附加 了 细节 信息 的 放大 图 (图 4-7) 。 虽 然 DragMag 避 免 了 放大 镜 遮 住 当前 位 置 
的 缺陷 ， 但 是 这 两 种 方法 都 有 一 个 同样 的 问题 ， 当 导航 员 想 要 引导 司机 穿 过 Huddersfield 的 街 
道 开 上 通 往 北 部 Halifax 的 主要 高 速 公路 时 可 能 遇 到 麻烦 。 拿 着 两 张 单独 的 地 图 ， 导 航 员 很 难 
回答 诸如 “高 街 和 市 场 街 是 否 通 往 主 高 速 公路 北口 ”这 样 的 问题 。 这 是 因为 总 图 和 细节 图 之 间 
缺失 了 联系 。 领 航 员 需要 的 是 某 种 数据 表示 ， 使 得 细节 地 图 中 的 道路 能 平滑 地 过 渡 到 总 图 中 。 
这 种 需求 是 很 普遍 的 ， 并 且 不 只 局 限于 地 图 的 使 用 中 ,通常 统称 为 焦点 + 上 下 文 
(focustcontext) 问题 ， 接 下 来 我 们 将 对 这 个 问题 进行 讨论 。 
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图 4-5 去 往 Halifax 方 向 的 旅途 中 途经 的 小 镇 Huddersfield 的 详细 信息 ( 见 彩 图 ) 
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图 4-6 — BAR LAMENT KAERA 图 4-7 DragMag 技 术 丰 许 对 任意 区 域 的 放大 ( 见 彩 图 ) 
围 的 细节 信息 (RR) 


41.3 变形 


最 早出 现 于 1980 年 的 变形 (distortion) 技术 是 解决 焦点 + 上 下 文 问 题 的 一 种 途径 。 双 焦 显 
示 bifocal display (Imperial College Television Studio, 1980; Spence and Apperley, 1982) 是 一 
种 基于 图 4-8 所 示 的 简单 隐喻 的 技术 。 显 示 在 一 条 很 长 的 纸张 上 的 信息 空间 (图 4-8a) KAT, 
它 的 细节 信息 不 能 完全 地 显示 在 正常 的 尺寸 有 限 的 显示 区 域内 。 将 信息 空间 的 左右 两 部 分 折 登 
起 来 (图 4-8b) ， 从 一 个 正确 的 视角 就 能 看 到 空间 内 的 部 分 细节 信息 ,“ 鸟 眼 效 果 ” 保 证 用 户 能 
得 到 其 余部 分 的 上 下 文 信息 (图 4-8c)。 因 此 ， 用 户 可 以 通过 双 焦 显示 对 中 央 区 域 的 信息 进行 
读 写 操作 ， 同 时 还 能 注意 到 边缘 位 置 的 来 自 老 板 的 消息 。 可 以 通过 特殊 颜色 或 垂直 位 置 来 提示 
新 消息 。 当 然 ， 新 消息 不 能 在 变形 区 域内 直接 显示 ， 但 用 户 一 旦 注意 到 了 重要 消息 的 出 现 ( 表 
示 为 一 个 很 窄 的 长 条 形 )， 就 可 以 滚动 信息 空间 将 该 消息 平滑 且 连 续 地 移动 到 中 心 的 未 变形 区 
域 ， 消 息 得 到 放大 从 而 变 得 可 读 。 图 4-9 演 示 了 一 个 简单 的 双 焦 显示 技术 。 

双 焦 显示 具有 很 多 重要 的 特点 。 其 最 大 的 特点 在 于 通过 变形 将 显示 区 域 划分 为 焦点 〈 未 变 
形 ) 和 上 下 文 (变形) 两 个 区 域 。 第 二 ， 在 滚动 过 程 中 ， 一 个 对 象 能 从 上 下 文 区 域 平 滑 而 连续 
地 过 渡 到 焦点 区 域 。 即 使 不 使 用 滚动 ， 也 能 体现 两 个 区 域 间 的 几何 和 (一 定 程度 上 的 ) 编码 连 
续 性 。 第 三 ， 显 示 区 域 还 可 以 体现 数据 编码 特点 。 原 始 的 信息 空间 (图 4-8) 是 一 个 二 维 空间 ， 
可 以 利用 这 两 个 维度 对 对 象 的 两 个 属性 进行 编码 。 例 如 ， 可 以 用 横 轴 表示 文件 的 接收 时 间 ， 用 
纵 轴 表 示 文 件 类 型 (如 内 部 /外 部 邮件 、 手 稿 、 时 间 表 等 )。 在 此 基础 上 ， 还 可 以 进行 进一步 的 
编码 ， 例 如 利用 颜色 或 形状 对 对 象 进行 区 分 。 关 于 编码 需要 注意 的 是 ， 同 样 的 对 象 在 两 个 区 域 
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中 可 能 有 不 同 的 编码 方式 。 焦 点 区 域 的 首要 任务 是 保证 可 读 性 和 交互 性 ;而 变形 区 域 关注 的 主 
要 问题 不 是 可 读 性 而 是 认 知 (awareness) 和 识别 (identification) ， 因 此 在 变形 区 域内 ， 文 字 
和 其 他 细节 信息 通常 被 抑制 (suppression) 。 关 于 对 象 编码 方式 的 选择 ， 在 满足 认 知 和 识别 的 
前 提 下 ， 一 般 应 使 对 象 在 两 个 区 域 中 的 编码 方式 尽量 保持 一 致 ， 否 则 区 域 之 间 的 过 滤 将 是 不 自 
然 的 。 
ES 
| 


a) 一 个 由 文件 、 邮 件 组 成 的 信息 空间 


% 
\ 视角 方向 


b) 空间 的 左右 两 端 被 折 又 





c) 从 一 个 正确 的 视角 看 到 的 信息 空间 
图 4-8 双 焦 显示 的 主要 原理 示意 图 ( 见 彩 图 ) 





图 4-9 早期 双 焦 显 示 实 例 (MEA) 
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双 焦 显示 的 另 一 个 重要 特点 是 用 户 的 手动 控制 。 如 同 最 初 提 到 的 ， 滚 动 操作 可 以 利用 人 的 
视觉 习惯 在 触摸 屏 上 得 以 实现 。 换 句 话 说， 用 户 可 以 持续 地 通过 简单 的 视觉 发 现 来 对 显示 进行 
控制 ， 例 如 用 户 可 以 判断 需要 显示 的 对 象 距离 焦点 区 域 的 距离 ， 调 整 手指 的 移动 动作 从 而 达到 
控制 滚动 操作 的 目的 。 

1. 应 用 

变形 技术 可 以 应 用 到 很 多 领域 里 。 在 生物 信息 领域 ， 可 以 利用 信息 技术 进行 生物 数据 的 分 
析 。 序 列 是 该 领域 中 最 重要 的 信息 ， 例 如 常见 的 DNA 分 子 中 的 核酸 以 及 组 成 生命 体 的 某 种 蛋 
白质 的 氨基 酸 等 。 图 4-10 显 示 了 其 中 一 种 氨基 酸 序 列 : 每 个 字母 对 应 一 种 氨基 酸 ， 背 景色 显示 
了 氨基 酸 序列 的 “电压 ”变化 。 由 于 用 一 维 序列 表示 了 三 维 信息 ， 导 致 序列 很 长 。 研 究 人 员 需 
要 了 解 整体 序列 ， 并 和 该 蛋白 质 的 其 他 描述 进行 对 比 ， 这 里 就 需要 用 到 变形 技术 ( 见 图 4-10)。 
注意 ， 由 于 显示 器 本 身 导致 的 数据 显示 的 不 连续 性 可 能 影响 研究 者 对 蛋白 质 真 实 信息 的 观察 ， 
因此 ， 这 里 使 用 的 变形 技术 并 未 产生 任何 的 信息 断裂 。 换 名 话说， 该 序列 中 设 有 出 现 类 似 图 4-8 
的 突然 折 登 点 。 





图 4-10 某 种 蛋白 质 的 氨基 酸 序列 (图 片 感谢 Tom Oldfield fn) ( 见 彩 图 ) 


图 4-11 所 示 的 表格 透镜 (table lens) 显示 了 另 一 种 拥有 多 个 焦点 区 域 的 变形 技术 。 这 种 方 
法 利用 了 人 们 熟悉 的 表格 描述 法 (Rao and Card, 1994)。 图 4-11a 所 示 的 表格 里 显示 了 大 约 300 
位 棒球 选手 的 信息 ， 每 位 选手 的 信息 表示 为 表格 中 的 一 行 ， 虽 然 每 一 行 中 的 条 形 (形成 一 个 直 
方 图 ) 代表 了 该 选手 的 场 上 位 置 和 命中 数 等 有 用 的 信息 ， 但 由 于 空间 有 限 ， 选 手 的 名 字 没 有 得 
到 完整 的 显示 。 该 描述 的 一 个 重要 特点 是 通过 鼠标 选中 某 列 可 以 进行 属性 的 重 排 。 这 个 表格 透 
镜 支 持 焦点 + 上 下 文 视图 ， 可 以 通过 展开 一 列 或 多 列 查看 姓名 等 细节 信息 (图 4-11b)。 


Er 
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:图 4-11 表格 透镜 。a) 没有 变形 ，b) 通过 变形 (展开 ) 显示 姓名 ( 见 彩 图 ) 
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图 4-11 (4%) 
2. 问题 的 普遍 化 
变形 技术 简单 有 用 ， 可 以 将 其 推广 到 一 般 情况 (Leung and Apperley, 1994)。 例 如 ， 图 4-12 
所 示 的 变形 可 以 叫做 X 变 形 。 还 可 以 对 X 和 Y 同 时 做 变形 (图 4-13)， 这 种 方法 很 适合 于 伦敦 地 
铁 (Leung et al., 1995) 的 显示 。 由 于 空间 有 限 ， 在 可 移动 的 焦点 区 域 (图 4-14) 外 的 站 点 名 
被 抑制 了 。 由 于 保持 了 焦点 区 域 边界 处 线路 的 连续 性 ， 因 此 该 图 的 可 理解 性 得 到 了 保证 。 


图 4-12 X 方 向 上 的 变形 示意 图 









图 4-13 X 和 7 方向 同时 变形 的 示意 图 
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图 4-14 伦敦 地 铁 的 变形 图 ， 保 证 了 变形 区 域 边缘 位 置 的 连续 性 ( 见 彩 图 ) 


对 X 和 7Y 同 时 做 变形 的 方法 还 可 以 应 用 到 日 历 上 (图 4-15)。 发 明 于 1980 年 的 这 样 一 个 变形 
日 历 在 当时 并 没有 太 大 的 实用 性 (Spence and Apperley, 1982; Apperly et al., 1982) ， 我 们 会 在 
第 6 章 详 细 讨 论 基于 双 焦 技术 的 PDA 日 历 实例 .(Bederson et al., 2003, 2004)。X 和 Y 同 时 变形 技 
术 的 优势 在 于 ， 相 同 的 变形 因子 能 创建 可 识别 的 缩 略图 。 图 4-16 所 示 的 翻转 缩放 技术 正 是 这 种 
方法 的 一 个 应 用 。 基 于 PDA 的 应 用 中 ， 有 限 的 显示 区 域 是 主要 关注 的 因素 (Bjork et al., 1999)。 
X 和 7Y 同 时 变形 技术 可 用 于 手机 上 的 图 片 浏览 ， 图 4-16 显 示 了 设计 师 的 原始 设计 草图 。 该 技术 
的 应 用 还 可 见 如 图 4-17 所 示 的 基于 PDA 的 路 线 显 示 ， 以 及 用 作对 比 的 图 4-18 所 示 的 基于 交互 平 
台 的 地 理 信息 的 协作 使 用 (Ryall et al., 2005), 
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图 4-15 结合 X 和 7 方向 上 的 变形 可 以 提供 一 个 方便 的 日 历 界面 
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图 4-17 PDA 上 的 变形 地 图 ， 显 示 了 站 点 间 的 联系 ， 并 保证 了 整 幅 图 的 连续 性 


MacOSX 操 作 系统 中 的 “dock” 也 使 用 了 相等 变形 因子 的 变形 技术 (图 4-19)。 该 方法 已 
被 应 用 于 图 片 集 的 快速 浏览 ( 见 4.2 节 ，McGuffin and Balakrishnan, 2002), 19914, 
Mackinlay 等 展示 了 变形 技术 的 3D 应 用 一 一 透视 墙 (图 4-20), 该 应 用 实现 了 对 焦点 区 域 的 延展 。 
变形 技术 还 可 以 用 于 层次 型 数据 (Stasko and Zhang, 2000) 的 表示 。 
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图 4-18 基于 交互 桌面 的 变形 地 图 (图 片 感谢 IDELIX Software Inc. 和 Mitsubishi 惠 允 ) 
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图 4-20 透视 墙 将 3D 效 果 应 用 于 双 焦 显示 技术 
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4.1.4 抑制 


抑制 是 和 变形 有 着 共同 目标 的 另 一 种 表示 技术 。Furnas (1981, 1986) 提出 了 在 局 部 细节 
信息 和 全 局 上 下 文 信息 间 取 得 平衡 的 观点 。 这 一 论述 和 Steinberg 的 海报 “从 第 九 大 道 看 全 世界 ” 
有 着 异曲同工 之 处 : 这 幅 海 报 以 曼哈顿 市 中 心 为 核心 区 域 ， 显 示 了 诸如 邮箱 、 地 铁 入 口 以 及 街 
角 小 店 等 许多 当地 人 很 感 兴趣 的 细节 信息 。 而 对 于 整个 澳洲 大 陆 这 样 对 当地 人 而 言 关 系 不 是 太 
密切 的 信息 ， 在 海报 上 被 描绘 为 遥远 海洋 中 的 一 个 小 点 。Furnas 发 现 设 定 感 兴趣 程度 (degree 
of interest) 是 很 有 用 的 ， 它 有 助 于 决定 应 该 得 到 编码 和 表示 的 数据 。 和 双 焦 显示 一 样 ， 
Steinberg 海 报 中 的 美国 地 图 也 使 用 了 变形 ， 并 对 无 关 的 细节 信息 进行 了 抑制 。 

Furnas 的 抑制 概念 建立 在 一 个 直观 且 生 动 的 公式 基础 上 。 任 一 数据 元 素 的 感 兴趣 程度 
(Dol) 都 可 由 一 个 包含 两 个 变量 的 公式 得 到 : 其 中 一 个 变量 是 该 元 素 的 先 验 重要 性 (A Priori 
Importance, API) ， 另 一 个 变量 是 该 元 素 距 离 用 户 当前 焦点 元 素 的 距离 (distance, D), 

API 和 D 的 概念 可 以 借助 于 图 4-21 所 示 的 公司 结构 树 加 以 理解 。 我 们 首先 讨论 距离 D。 假 设 
需要 查询 该 公司 的 生产 活动 ， 我 们 自然 会 去 关注 负责 生产 的 人 员 P。 当 然 ， 我 们 可 以 在 该 人 员 
的 某 种 数据 编码 上 简单 地 点 击 一 下 就 可 以 看 到 这 个 人 的 相关 信息 。 但 是 ， 考 虑 到 查询 的 普遍 实 
质 ， 如 果 在 聚焦 P 的 同时 能 看 到 他 的 工作 环境 的 上 下 文 信息 ， 这 将 更 有 利于 我 们 的 查询 。P 的 
直接 上 司 S 是 相关 度 很 高 的 一 个 人 员 ， 直 接 向 P 进 行 日 常 汇报 的 K、M 和 N 也 是 可 能 的 三 个 相关 
人 员 。 而 直接 向 N 进 行 汇报 的 FE 和 G 的 相关 性 不 是 太 高 。 同 样 的 ， 直 观 来 看 公司 总 裁 也 和 我 们 的 
查询 不 太 相 关 。 我 们 可 以 通过 当前 焦点 P 和 其 他 人 员 之 间 的 距离 来 对 以 上 考虑 做 一 般 化 解释 。 
对 两 个 直接 相连 的 结 点 赋 一 个 单位 权 值 ， 这 样 ， 根 据 结 点 离 当 前 焦点 P 的 距离 可 以 为 图 4-21 中 
的 每 个 结 点 研一 个 距离 值 (图 4-22)。 从 查询 的 实质 来 看 ， 可 以 通过 设 定 一 个 上 限 阅 值 来 定义 
我 们 的 感 兴趣 度 (图 4-23)， 这 样 就 可 以 很 自然 地 得 到 所 要 查找 的 信息 (图 4-24)。 





F G 
图 4-21 一 个 公司 的 结构 树 图 4-22 显示 其 他 结 点 距 当前 焦点 的 距离 


关于 API， 可 以 根据 结 点 在 这 个 组 织 结 构 中 的 重要 性 为 树 中 的 每 个 结 点 赋 一 个 API 值 ， 而 
这 个 值 与 结 点 距 当 前 焦点 的 距离 无 关 。 很 自然 的 ， 总 裁 的 API 值 是 最 高 的 (例如 10)， 其 余人 
员 的 API 值 随 着 他 们 职位 的 降低 而 依次 递减 (图 4-25) 。 每 个 结 点 的 API 值 和 D 值 之 间 的 差 值 即 
为 该 结 点 的 感 兴趣 度 Dol。 本 例 中 各 结 点 的 DoI 值 见 图 4-26。 如 果 为 感 兴趣 度 设 置 一 个 下 限 冰 
值 6， 则 对 应 的 焦点 和 上 下 文 信息 如 图 4-26 所 示 。API 值 显示 总 裁 是 这 个 结构 树 中 最 重要 的 人 
员 ， 这 将 导致 上 下 文 信息 偏向 职位 高 的 人 员 。 
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图 4-23 通过 设置 各 结 点 和 当前 焦点 的 距离 的 上 图 4-24 同 图 4-23 对 应 的 焦点 和 上 下 文 信息 
限 阀 值 来 选 定 上 下 文 区 域 





图 4-25 为 结构 树 中 的 每 个 结 点 赋 一 个 API ( 先 验 重 ”图 4-26 每 个 结 点 的 感 兴 趣 度 Dol (=API-D)。 为 Dol 
要 性 ) 值 设置 下 限 阔 值 6， 相 关 的 结 点 显示 在 阴影 区 
域内 


Furnas 提 出 的 DoI 概 念 有 着 广泛 的 应 用 ， 例 如 需要 从 一 个 庞大 的 结构 中 了 解 一 个 小 部 件 的 
功能 。 工 程 系统 中 错误 的 定位 和 修正 需要 专家 对 庞大 的 图 表 进 行 详细 检查 ， 定 位 到 可 能 相关 的 
(通常 是 很 小 的 ) 部 件 ， 才 能 进行 下 一 步 的 修正 操作 。 飞 机 的 维护 工作 也 是 一 样 的 ， 这 促使 美 
国 空军 开发 了 一 个 系统 ， 在 该 系统 中 ， 一 旦 兴趣 度 函 数 得 到 确定 ， 图 4-27 所 示 的 工程 图 就 能 自 
动 简化 为 图 4-28 (Mitta, 1990)。 

魔术 透镜 (magic lens) 是 抑制 技术 的 很 有 价值 的 应 用 。 在 图 4-29 所 示 的 例子 中 ， 图 4-29a 
显示 的 是 一 幅 传统 的 地 图 ， 其 中 显示 了 一 个 街区 内 的 公路 、 街 道 、 教 堂 、 铁 路 线 和 车 站 。 维 修 
小 组 要 检查 该 街区 内 的 燃气 供应 情况 ， 需 要 了 解 地 下 燃气 管道 的 位 置 及 相互 关联 性 、 闪 门 以 及 
电线 、 电 话 线 等 其 他 预 埋 管道 的 位 置 (图 4-29b) 。 然 而 ， 由 于 没有 相关 地 理 信息 ， 图 4-29b 的 
实际 用 处 并 不 大 。 图 4-29c 相 对 于 图 4-29b 更 有 用 ， 因 为 它 在 地 图 中 显示 了 某 个 感 兴趣 小 区 域内 
的 燃气 、 电 线 及 电话 线 管道 信息 。 这 样 维修 人 员 可 以 方便 地 检查 到 公路 尽头 ， 有 助 于 深入 地 进 
行 查 错 。 这 样 一 种 对 不 同 “ 层 ”数据 的 检查 功能 通过 “将 工具 引入 数据 ”实现 不 同 层 次 上 的 
(交互 式 ) 数据 检查 ， 是 一 种 很 有 用 的 称 为 魔术 透镜 的 技术 (Stone et al., 1994) 。 它 的 魔力 也 
部 分 来 自 人 们 所 熟悉 的 放大 镜 的 隐喻 。 该 技术 用 到 的 双重 透镜 和 “看 穿 ”(see-through) 工具 
(Bier et al., 1994) 可 以 推广 到 一 般 情况 。 魔 术 透 镜 在 生物 信息 学 领域 也 有 很 多 应 用 。 图 4-30 
利用 活动 的 魔术 透镜 透 过 一 个 蛋白 质 分 子 表面 来 查看 内 部 的 原子 结构 。 
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图 4-29 魔术 透镜 示意 图 。a) 传统 的 区 域 地 图 ，b) 该 区 域内 的 各 种 公共 预 埋 管 道 (燃气 、 水 、 
HLS) ，c) 通过 (活动 的 ) 魔术 透镜 查看 该 地 区 内 某 感 兴趣 区 域 里 的 管道 埋设 情况 





图 4-30 在 某 数量 级 上 (ID=10mh) 用 不 同 颜色 标注 蛋白 质 转移 酶 分 子 表 面 的 潜在 DNA 静 电 跃进 ， 
魔术 透镜 窗口 中 显示 了 相关 原子 结构 ， 跃 进 的 配合 基 结 构 高 显 为 圆柱 状 ， 从 而 提供 了 蛋 
白质 的 内 部 视图 ( 见 彩 图 ) 
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1. 变形 和 抑制 的 结合 

决定 何 时 该 聚焦 、 何 时 该 过 滤 是 一 个 常见 的 设计 挑战 。 在 实际 应 用 中 ， 变 形 和 抑制 的 结合 
可 以 带 来 一 些 好 处 。 双 焦 显 示 结 合 了 这 两 种 技术 ， 一 般 没 有 显示 出 变形 区 域 中 的 信息 对 象 的 全 
部 细节 信息 。 虽 然 可 以 使 用 Furnas 的 Dol 概 念 自动 地 决定 变形 区 域 中 的 数据 描述 ， 但 更 多 情况 
下 视觉 设计 师 会 为 具体 的 应 用 创建 特定 规则 。 

图 4-31 显 示 了 一 个 变形 和 抑制 相 结 合 的 例子 ， 并 使 用 了 如 图 4-32 所 示 的 橡皮 变形 (rubber 
sheet distortion) 技术 (Kadmon and Shlomi, 1978) 。 这 个 例子 应 用 于 以 下 场景 : 用 户 现在 位 于 
曼彻斯特 的 一 家 旅馆 ， 他 想 去 拜访 住 在 40 英 里 外 的 Huddersfield 的 姑姑 Mabel。 为 了 完成 这 个 任 
务 ， 我 们 首先 想象 打印 在 一 张 橡皮 上 的 英格兰 北部 地 图 ， 然 后 从 里 往外 推 挤 这 张 橡皮 ， 使 这 两 
个 城市 的 足够 多 的 细节 信息 得 以 显示 (图 4-31) 。 这 样 用 户 就 可 以 在 这 两 个 城市 中 实现 沿 逐 条 
街道 的 定位 以 及 在 汽车 高 速 公路 的 出 口 处 来 回 运 动 。 除 了 这 样 的 变形 以 外 ， 我 们 意识 到 ， 一 旦 
用 户 上 了 高 速 公路 ， 细 节 信 息 就 不 再 重要 了 。 对 用 户 而 言 ， 偶 然 出 现 的 地 标 物 即 可 轻松 地 提供 
定位 信息 ， 确 认 当 前 路 线 是 否 和 原 定 计划 一 致 。 正 是 由 于 这 个 原因 ， 图 中 只 显示 了 高 速 公 路 两 
旁 的 地 标 物 ， 而 其 他 细节 信息 被 抑制 了 。 
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图 4-31 橡皮 变形 和 抑制 的 结合 ， 产 生 了 一 幅 适 合 图 4-32 图 4-31 所 示 地 图 中 使 用 的 橡皮 变形 技术 
城市 间 旅 行 的 地 图 


出 现在 PDA 和 手机 上 的 “ 锁 眼 ”问题 提醒 我 们 这 样 一 个 事实 : 数据 描述 和 数据 表示 存在 着 
不 可 避免 的 内 在 联系 ,我们 一 定 要 注意 避免 由 于 过 度 关注 其 中 一 项 而 导致 忽略 另 一 项 。 基 于 
halo 技 术 (Baudisch and Rosenholtz, 2003) ， 地 图 (图 4-33) 上 的 圆 弧 反映 了 当前 屏幕 上 没有 
显示 的 感 兴趣 点 的 位 置信 息 。PDA 屏 幕 上 的 这 些 绝 描述 了 没有 显示 的 地 点 ， 用 户 可 以 通过 为 弧 
所 对 应 的 圆 建 立 心理 模型 来 理解 这 些 未 显示 在 当前 屏幕 上 的 地 点 及 它们 的 中 心 位 置 。 

2. 历史 评论 

尽管 变形 和 抑制 的 概念 在 20 世 纪 80 年 代 就 出 现 了 ， 然 而 维持 焦点 和 上 下 文 之 间 的 平衡 这 一 
观点 的 提出 时 间 更 早 。 例 如 ， Farrand 早 在 1973 年 就 基于 自己 丰富 的 工程 设计 经 验 发 表 过 以 下 
评论 (Farrand, 1973): 

开 窗 术 迫使 人 们 记 住 相 对 于 整个 场景 来 说 已 经 出 现 的 部 分 。 
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图 4-33 通过 (基于 halo 技 术 的 ) 数据 描述 为 小 型 屏幕 提供 上 下 文 信息 (图 片 感谢 Patrick Baudisch 
Ef) 


这 里 的 “ 开 窗 术 ” 指 的 就 是 “滚动 "， 并 且 ， 

一 个 有 效 的 变换 从 一 定 程 度 上 来 看 必须 在 维持 整体 认 知 的 同时 提供 细节 信息 。 
这 里 的 变换 指 的 是 将 现 有 的 大 型 图 标 变换 成 一 个 可 以 更 有 效 地 在 有 限 区 域 中 显示 出 来 的 图 标 。 
在 同一 篇 论文 中 ，Farrand 提 出 了 一 个 非常 流行 的 术语 “ 鱼 眼 ”(fisheye， 现 在 这 个 术语 同时 包 
含 变形 和 抑制 )， 并 引用 了 一 段 更 早期 的 评论 (1971, unreferenced) ; 

sree 显示 区 域 应 满足 以 下 两 个 需求 : 1) 提供 可 供 交 互 的 有 效 细 节 ; 2) 维持 整个 场景 的 全 


4.1.5 缩放 和 平移 


到 目前 为 止 ， 我 们 讨论 过 的 数据 表示 技术 如 滚动 、 总 图 + 细节 、 变 形 和 抑制 等 关注 的 重点 
都 是 如 何 对 可 用 显示 区 域 进行 最 有 效 的 利用 。 现 在 我 们 要 讨论 缩放 和 平移 。 平移 (panning) 
是 指 在 一 张 较 大 的 二 维 图 片上 做 视窗 的 平滑 连续 的 移动 (图 4-34) ， 缩 放 (zooming) 是 指 在 固 
定 窗口 中 对 二 维 图 片 的 某 个 持续 变 小 / 变 大 的 部 分 做 平滑 连续 的 放大 /缩小 ， 见 图 4-35。 一 般 通 
过 平移 来 确定 视窗 的 位 置 ， 然 后 通过 缩放 来 实现 总 图 和 细节 之 间 的 平滑 过 渡 。 


— zy 
Ber 
So 





A: t a ra h 


图 4-34 平移 是 在 二 维 图 片上 做 视窗 的 平滑 移动 ” 图 4-35 缩放 是 对 二 维 图 片 的 某 个 持续 变 小 / 变 大 的 部 
分 做 平滑 连续 的 放大 /缩小 


除了 放大 过 程 中 不 可 避免 地 忽略 上 下 文 信息 而 导致 过 滤 现 象 ， 传 统 的 “几何 ”缩放 活动 中 
没有 对 数据 本 身 或 其 描述 进行 修改 。 从 这 个 角度 来 看 ， 放 大 和 变形 (例如 双 焦 显示 ) 是 很 不 同 
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的 ， 变 形 的 目的 是 通过 保留 上 下 文 信息 来 实现 聚焦 而 非 过 滤 操 作 。 Cairns 和 Craft (2005) 指出 
缩放 有 助 于 两 类 认 知 任务 的 实现 。 通 过 放大 ， 外 部 信息 从 视窗 中 移出 ， 可 能 生成 一 个 更 易于 操 
作 的 视图 ， 而 缩小 使 隐藏 信息 变 得 可 见 ， 这 类 隐藏 信息 通常 是 已 知 的 但 是 无 法 回忆 起 的 上 下 文 
信息 。 缩 放 可 以 帮助 用 户 重新 发 现 他 们 在 信息 空间 内 的 位 置 ， 从 而 在 心理 模型 中 融入 新 的 上 下 
文 信息 。 

我 们 可 以 通过 空间 比例 图 表 (space-scale diagram) 这 个 分 析 框 架 (Furnas and Bederson, 
1995) 来 对 平移 和 缩放 做 讨论 。 在 图 4-36 中 所 示 的 三 维 空间 中 , 其 中 的 两 维 用 来 表示 空间 信息 ， 
另 一 维 (垂直 方向 ) 表示 显示 比例 (因此 称 作 空间 比例 图 表 )。 图 中 显示 了 一 幅 地 图 的 四 个 拷 
贝 ， 每 个 拷贝 都 在 比例 轴 上 做 了 一 定 程 度 的 放大 。 注 意 ， 地 图 中 的 一 个 点 变 成 了 空间 比例 图 表 
中 的 一 条 射线 。 用 户 的 视窗 表示 为 一 个 固定 大 小 的 和 矩形， 在 图 中 通过 做 水 平方 向 的 移动 来 实现 
平移 ， 通 过 沿 射线 方向 的 移动 来 实现 缩放 。 


纽约 射线 伦敦 射线 





从 X 稍 作 平 移 
到 达 Y 


图 4-36 结合 了 缩放 和 平移 的 空间 比例 图 表 


通过 结合 缩放 和 平移 ， 空 间 比 例 图 表 可 以 帮助 用 户 维持 对 数据 的 心理 模型 。 以 图 4-36 所 示 
地 图 为 参考 ， 我 们 假设 用 户 刚 看 过 了 纽约 ， 现 在 想 看 伦敦 。 读 者 的 第 一 反应 可 能 是 从 W 到 2Z 做 
一 个 视窗 的 水 平移 动 ( 即 平移 )， 但 在 一 大 半 的 过 渡 过 程 中 用 户 所 见 的 只 有 大 西洋 。 更 合理 一 
点 的 做 半 是 ， 首 先 通过 一 个 渐进 缩小 (视窗 内 可 能 会 出 现 美 国 的 东海 岸 和 英国 ) 过 渡 到 X， 然 
后 跨 过 大 西洋 做 一 个 到 Y 的 平移， 在 一 大 半 的 平移 过 程 中 窗口 中 出 现 的 将 是 美国 和 英国 。 当 英 
国 填 满 视窗 后 ， 就 可 以 放大 到 伦敦 (Z) 。 人 谷歌 地 球 有 效 地 利用 了 平移 和 缩放 的 结合 ， 
Cockburn 和 Savage (2003) 也 对 这 两 种 技术 的 自动 结合 做 了 大 量 深入 的 研究 。 

以 上 提 到 的 缩放 活动 通常 属于 几何 缩放 (geometric zoom)。 它 是 连续 的 ， 放 大 将 导致 过 
滤 和 上 下 文 信息 的 丢失 ,但 是 同时 带 来 了 细节 的 放大 。 然 而 很 多 实际 应 用 中 并 不 需要 连续 的 视 
图 变换 ， 而 加 入 了 额外 细节 信息 和 单纯 的 放大 功能 的 离散 视图 变化 将 更 为 实用 。 例 如 ， 从 英 格 
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兰 北 部 的 总 图 (图 4-5 的 左 图 ) 变化 到 Huddersfield 的 细节 图 (图 4-5 的 右 图 )。 前 面 讨论 过 的 
图 3-21 也 是 一 个 很 好 的 例子 ， 除 了 最 主要 的 价格 信息 ， 还 可 以 减少 感 兴趣 汽车 的 数目 ， 用 节约 
出 来 的 空间 显示 汽车 品牌 信息 。 图 4-37 (A~C) 显示 了 一 个 空间 数据 管理 系统 (Data 
Management System, Herot, 1980; Herot et al.,1981) 。 有 时 船长 需要 查看 现 有 可 供 使 用 的 船只 
信息 (视图 A)， 随 后 又 可 能 要 了 解 一 稻 特 定 船只 的 详细 信息 (视图 B)。 从 视图 A 到 B 的 过 渡 并 
不 是 一 个 纯粹 的 几何 缩放 : 如 果 是 的 话 ， 在 视图 B 中 出 现 的 船只 文字 描述 也 应 该 显示 在 视图 A 
中 ,但 这 些 文字 在 视图 A 中 可 能 会 变 得 不 可 读 而 且 会 分 散 用 户 注意 力 。 从 视图 A 到 视图 B 的 过 
渡 是 离散 的 ， 由 于 新 视图 传达 的 信息 和 旧 视 图 不 同 ， 因 此 我 们 可 以 称 之 为 语义 缩放 
(semantic zoom)。 用 户 对 视图 B 可 能 是 满意 的 ， 但 有 可 能 还 需要 查看 一 些 附加 细节 信息 ， 其 
至 是 船只 的 图 片 而 非 简单 的 图 标 ， 因 此 需要 用 到 一 个 从 视图 B 到 视图 C 的 单纯 的 语义 缩放 。 实 
际 上 我 们 已 经 在 双 焦 显示 (图 4-8) 中 看 到 过 语义 缩放 的 例子 : 同样 的 对 象 在 焦点 区 域 和 变形 
区 域 中 有 着 不 同 的 描述 。 


几何 缩放 
十 


语义 缩放 







视图 B 
S.S Artemis 200K tons 
Fuel 2 days Readiness RED 





语义 缩放 


S.S Artemis 


视图 C Fuel 2 days 


Capt. F Watkinson Code blue 
Aircraft: 30 W121] 6 heli 
Armament 20 FF 6 XA 2 YF 








图 4-37 几何 缩放 和 语义 缩放 的 结合 


以 上 展示 的 所 有 例子 都 体现 了 语义 缩放 和 几何 缩放 的 区 别 : 几何 缩放 关系 到 一 个 完整 的 自 
动 过 程 (放大 操作 ) ， 而 语义 缩放 产生 一 个 新 的 数据 描述 。 设 计 和 语义 缩放 相关 的 选择 性 抑制 
离 自动 化 还 差 得 很 远 ， 交 互 设计 师 必须 理解 所 要 支持 的 任务 以 及 相应 的 解决 方法 才能 有 效 地 设 
计 出 组 成 语义 缩放 的 数据 描述 序列 。 这 样 的 设计 方式 不 是 直接 的 : 必须 考虑 到 作为 前 驱 视图 提 
示 者 的 内 容 、 作 为 总 图 的 内 容 以 及 传递 新 理解 的 内 容 之 间 的 平衡 关系 。 在 6.5 节 的 案例 分 析 中 
我 们 将 会 看 到 一 个 考虑 了 这 些 设计 因素 的 实例 。 


4.2 时 间 局 限 
4.2.1 快速 序列 视觉 表示 
要 想 引 起 用 户 对 某 些 数据 的 视觉 关注 ， 所 要 做 的 工作 远 不 止 显 示 区 域内 的 布局 设置 。 交 互 
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设计 师 的 另 一 个 设计 自由 是 将 数据 设 定 为 顺序 出 现 (显示 速度 通常 很 快 ) 而 非 同 时 出 现 。 现实 
世界 中 的 一 个 例子 是 迅速 翻动 书本 从 而 在 短 短 几 秒 钟 内 获得 对 该 书 内 容 的 大 体 印象 。 这 样 的 行 
为 可 以 称 为 快速 序列 视觉 表示 (Rapid Serial Visual Presentation, RSVP)。 例 如 ， 图 4-38 可 以 依 
次 显示 一 个 图 片 集中 的 所 有 图 片 ， 每 幅 图 片 显示 大 约 100 毫 秒 。 即 使 在 这 样 快速 的 显示 速度 下 ， 
用 户 能 正确 判断 出 其 中 是 否 出 现 一 幅 目标 图 片 的 概率 还 是 很 高 的 。 在 介绍 了 RSVP 模 式 后 ， 我 
们 来 讨论 显示 区 域 的 可 能 用 法 : 图 4-38 所 示 的 叫 RSVP 模 式 〈“ 幻 灯 片 模式 " ) 。 图 4-39 同 时 显示 
多 幅 图 片 ， 因 而 每 幅 图 片 的 尺寸 较 小 ， 我 们 称 之 为 非 顺序 型 的 “ 堆 模 式 ”。 





图 4-38 快速 序列 视觉 表示 (Rapid Serial Visual 图 4-39 图 片 集 的 同时 表示 ( 见 彩 图 ) 
Presentation, RSVP) 。 每 次 显示 图 片 集 中 的 
一 幅 图 片 ， 图 片 之 间 以 一 定 的 速度 〈 如 1 秒 
钟 显示 10 幅 图 片 ) 进行 切换 〈 见 彩 图 ) 


也 许 大 家 想不到 ，RSVP 技 术 可 以 支持 日 常生 活 中 的 很 多 任务 (Spence, 2002)。 例 如 ， 很 
多 时 候 我 们 需要 快速 翻动 一 个 (新 的 ) 文件 夹 来 “看 看 里 面 有 些 什么 ”或 “确定 里 面 是 否 有 某 
幅 图 片 ， 而 这 幅 图 片 的 位 置 记 不 清 了 ”。 开 会 时 ， 所 有 与 会 者 都 把 报告 存在 手提 电脑 上 ， 通 常 
也 是 通过 RSVP 方 式 来 找到 某 个 报告 内 的 某 一 页 。 用 户 对 该 页 位 置 的 记忆 (“ 那 页 大 概 在 报告 的 
中 间 位 置 ， 页 面 左 下 方 有 个 绿色 的 图 表 ”) 有 助 于 快速 查询 。 晚 上 回 家 后 通过 快速 转台 可 以 了 
解 当前 正在 播放 的 电视 节目 。 为 了 在 照片 库 中 找到 一 张 已 知 照片 给 朋友 看 ， 我 们 通常 会 快速 地 
翻动 一 盒 照 片 。 对 于 数字 照片 也 一 样 ， 我 们 可 以 通过 数字 RSVP 方 法 〈 例 如 iPhoto) 加 以 实现 。 

即使 是 一 个 定义 很 模糊 的 问题 (如 “母亲 节 我 该 送 妈妈 什么 礼物 ? “) ， 快 速 地 浏览 一 系列 
打印 出 来 的 或 在 线 的 对 象 图 片 就 如 同 在 购物 中 心里 快速 走动 一 样 ， 也 可 以 很 好 地 帮助 用 户 定位 
感 兴趣 的 对 象 。 针 对 这 个 问题 ，Wittenburg 等 (1998, 2000) 提出 了 “悬浮 RSVP” (floating 
RSVP) 技术 : 图 片 初始 时 出 现 “在 远 处 "， 逐 渐 向 用 户 “ 移 动 "， 这 就 好 像 是 在 高 速 公路 上 开 
车 时 看 到 各 种 标志 牌 向 你 移动 一 样 。 图 4-40 是 使 用 了 这 种 技术 的 网 上 购物 中 心 截图 。 右 边 的 两 
个 箭头 用 于 手动 控制 移动 的 方向 和 速度 。 同 样 是 在 网 上 购物 的 情景 下 ，Wittenburg 等 (1998， 
2000) 提出 RSVP 的 另 一 种 变形 :“ 拼 接 图 RSVP” (collage RSVP) 。 该 技术 使 用 了 将 图 片 (本 
例 中 为 书籍 封面 ) 放 在 桌面 上 的 隐喻 (图 4-41)。 虽 然 较 早 显示 的 图 片 最 终 会 被 其 他 图 片 所 遮 
m, 但 用 户 还 是 有 机 会 发 现 感 兴趣 的 对 象 ， 并 且 可 以 对 这 种 表示 做 逆转 。Lam 和 Spence (1997) 
将 手动 控制 的 RSVP 和 双 焦 技术 相 结合 ， 为 电影 库 提 供 了 一 个 方便 的 检索 界面 (图 4-42) 。 
RSVP 也 有 助 于 改进 小 显示 区 域 所 带 来 的 局 限 性 ， 我 们 称 之 为 “时 间 和 空间 的 折 中 ”。Bruijn 和 
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Tong (2003) 在 网 页 浏览 的 前 提 下 对 这 个 问题 进行 了 探讨 ( 见 6.3 节 )。 
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图 4-40 在 “悬浮 RSVP” 表 示 中 ， 图 片 从 远 处 朝 图 4-41 用 “拼接 图 RSVP” 表 示 一 个 网 上 书店 内 


用 户 方向 移动 。 用 户 可 以 通过 箭头 控制 的 书籍 ， 书 籍 封 面 依次 拼 放 在 界面 中 。 界 
“移动 ”的 方向 和 速度 (图 片 感谢 Kent 面 下 方 的 箭头 用 于 控制 表示 的 速度 和 方向 
Wittenburg 惠 人 允 ) (图 片 感谢 Kent Wittenburg H fè ) 





图 4-42 电影 广告 片 的 浏览 界面 。 光 标 运动 轨迹 两 旁 的 海报 随 之 凸显 出 来 。 整 个 海报 库 使 用 了 双 
焦 显 示 技 术 ， 通 过 滚动 可 以 将 感 兴趣 的 海报 移动 到 中 心 区 域 ， 点 击 鼠 标 可 以 播放 该 影片 
的 一 段 剪 辑 


Tse 等 (1998)、Komlodi 和 Marchionini (1998) 等 对 RSVP 的 一 个 特殊 应 用 进行 了 研究 ; 
不 要 求 用 户 用 正常 速度 从 头 开始 观看 ， 系统 就 能 帮助 用 户 决定 是 否 要 观看 一 部 视频 或 影片 。 
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Tse 和 同事 们 让 用 户 快速 观看 影片 的 一 些 关键 帧 ， 这 样 可 以 对 影片 的 内 容 有 个 大 致 的 了 解 。 研 
究 发 现 帧 的 切换 速度 以 一 秒 10 帧 为 佳 ， 这 样 可 以 保证 用 户 了 解 到 影片 的 大 致 内 容 。 电 影 频道 用 
户 也 具有 类 似 的 特性 ， 他 们 常常 只 需要 一 到 两 秒 就 能 决定 是 否 观 看 整 部 影片 。 最 近 ，Flipper 系 
统 也 使 用 了 RSVP 技 术 中 的 翻 页 隐喻 来 帮助 对 数字 文档 的 视觉 搜索 (Sun and Guimbretiere, 
2005). 

如 果 交 互 设计 师 想 要 开发 RSVP 技 术 的 众多 潜在 应 用 ， 则 需要 了 解 人 类 面 对 快 速 翻动 的 图 
片 的 反应 。 幸 运 的 是 ， 早 在 RSVP 的 数字 化 实现 成 为 现实 前 ， 认 知心 理学 家 就 已 经 开始 这 方面 
的 研究 了 。 

一 警 而 过 的 图 片 库 

关于 RSVP 技 术 的 一 个 核心 问题 是 “要 保证 且 标 图 片 能 被 识别 出 来 ， 图 片 之 间 的 切换 速度 
应 该 是 多 少 ?”。 换 名 话 说 ，RSVP 的 快速 翻动 究竟 应 该 快 到 什么 程度 ? 在 保证 单个 目标 对 象 
能 被 识别 的 前 提 下 ， 图 片 切换 速度 越 快 ， 作 为 表示 技术 的 RSVP 就 越 吸 引 人 。 相 关 的 实验 证 据 
可 参见 文献 (Potter and Levy, 1990) 和 图 4-43 的 简要 总 结 。 在 这 个 实验 中 ， 首 先 向 实验 参与 者 
展示 一 张 图 片 ， 然 后 播放 一 系列 快速 切换 的 图 片 ， 要 求 参 与 者 回答 里 面 是 否 出 现 这 张 图 片 。 实 
验 显 示 ， 即 使 一 秒 内 显示 了 10 张 图 片 ， 即 每 张 图 片 只 显示 短暂 的 100 上 毫秒 ， 参 与 者 给 出 正确 答 
案 的 几率 仍 高 达 90%。 虽 然 图 4-43 总 结 的 实验 结果 可 能 是 对 RSVP 技 术 最 深入 的 研究 ， 它 只 是 
历年 来 能 收集 到 的 来 源 单一 的 实验 证 据 。 对 于 想 要 继续 深入 研究 的 读者 ， 我 们 强烈 推荐 
«Fleeting Memories) 一 书 (Coltheart, 1999b ) 。 


图 片 的 表示 









提前 对 参与 者 参与 者 的 表现 


做 培训 






“这 是 一 张 目 
标 图 片 。 请 告 
e (eee ass 
将 看 到 的 N 张 图 80% ~90% 
片 中 ， 读 图 片 
ERA 大 约 100 毫 秒 
图 4-43 该 实验 测试 参与 者 正确 判断 图 片 集中 是 否 出 现 一 张 提前 看 过 的 目标 图 片 ， 图 片 的 显示 速 
度 为 1 种 钟 10 张 


4.2.2 空间 和 时 间 资 源 


对 不 同 表示 模式 的 优点 进行 直观 讨论 是 简单 而 危险 的 。 比 较 需 要 建立 在 一 定 基础 之 上 ， 而 
资源 就 是 其 中 的 一 个 基础 。 可 以 认为 支持 某 项 任务 的 图 片 库 的 交互 式 设计 受到 两 种 资源 的 限制 。 
一 个 是 我 们 在 前 面 4.1 节 中 已 经 讨论 过 的 显示 区 域 。 由 于 任务 通常 要 求 在 一 个 给 定 的 时 间 限 制 内 
完成 ， 因 此 ， 另 一 个 限制 就 是 表示 总 时 长 。 相 信 我 们 都 有 这 样 相同 的 经 历 ， 当 系统 执行 某 项 任 
务 时 ， 相 关 信 息 过 了 很 长 时 间 才 得 以 显示 ， 这 会 加 剧 用 户 的 诅 形 度 ， 导 致 用 户 兴趣 度 的 丢失 。 

我 们 可 以 用 图 4-44 所 示 的 资源 盒 来 描述 显示 区 域 和 表示 总 时 长 的 并 发 限制 。 这 样 ， 一 个 有 
趣 的 问题 就 出 现 了 :“ 要 将 一 个 图 片 集 呈 现在 用 户 面前 , 这 些 图 片 在 资源 盒 内 应 该 如 何 排列 ? ”。 
现在 已 有 很 多 解决 方法 ， 其 中 一 些 我 们 在 前 面 的 章节 中 已 经 讨论 过 ， 当 然 还 会 出 现 新 的 方法 ， 
但 是 所 有 方法 的 目标 都 在 于 向 交互 设计 师 展 示 信息 呈现 的 不 同方 式 ， 例 如 图 4-45 所 示 的 6 种 表 


第 4 章 数据 表示 "93 


示 模 式 。 当 使 用 资源 盒 来 比较 不 同 的 表示 模式 时 ， 对 于 所 有 的 模式 ， 假 设 可 用 的 显示 区 域 和 表 


示 总 时 长 都 是 一 样 的 。 





A 表示 时 长 


图 4-44 用 “资源 盒 ”表示 显示 区 域 和 表示 总 时 长 对 数据 表示 的 限制 


根据 某 个 特定 的 图 片 是 显示 在 唯一 固定 的 位 置 上 ， 还 是 按照 某 种 顺序 依次 显示 在 不 同 的 位 
置 上 ， 可 将 图 4-45 中 的 各 种 表示 模式 分 为 静态 组 和 活动 组 两 类 。 在 三 种 静态 模式 中 ， 我 们 已 经 
讨论 过 幻灯 片 模式 (A) 和 堆 模式 (C)。 剩 下 的 混合 模式 (B) 的 一 大 潜在 优点 是 ， 当 处 于 幻 
灯 片 模式 时 ， 一 张 图 片 可 能 会 显示 四 次 。 但 是 它 的 潜在 缺点 是 每 张 图 片 将 占据 1/4 的 显示 区 域 。 
将 混合 模式 纳入 图 4-45 的 原因 在 于 早期 的 实验 (Fawcett et al., 2004) 显示 ,混合 模式 是 最 受 欢 


迎 的 静态 模式 ， 并 且 当 需要 判断 某 


张 特定 图 片 是 否 出 现在 一 组 图 片 中 时 ， 该 模式 是 最 有 效 的 。 
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模式 F， 流 模式 


图 4-45 三 种 静态 表示 模式 (A、B、C) 和 三 种 活动 表示 模式 (D, E, F) (图 片 感谢 Katy Cooper 惠 允 ) 


在 图 4-45 所 示 的 三 种 活动 模式 中 ， 模 式 D 叫 对 角 线 模式 ， 也 叫 “ 时 间 隧 道 ”模式 
(Wittenburg et al., 2003)。 在 该 模式 中 ， 每 张 图 片 从 左上 角 移 动 到 右 下 角 。 交 互 设计 师 可 以 在 
图 片 沿 着 对 角 线 运动 的 同时 增 大 图 片 尺寸 。 若 想 通 过 缩小 每 幅 图 片 的 可 见 部 分 来 减少 图 片 的 位 
移 ， 也 可 以 使 相 邻 图 片 有 一 定 程度 的 重 又 。 从 模式 D 以 及 我 们 在 后 面 章节 的 讨论 可 以 看 到 ， 关 
键 性 的 设计 决策 主要 考虑 图 片 以 何 种 方式 从 显示 区 域 中 消失 。 图 片 可 以 以 连续 方式 运动 ， 然 后 
逐渐 消失 ， 也 可 以 在 消失 前 在 右边 的 角落 里 满 屏 显 示 100 毫 秒 。 我 们 将 看 到 ， 后 一 种 方式 是 很 
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明智 的 。 在 环形 模式 (E) 中 ， 一 幅 图 片 首先 以 最 大 尺寸 显示 在 中 心 位 置 ， 在 该 位 置 短 时 间 停 
留 后 ， 以 近似 环形 的 路 线 运动 ， 最 后 从 左上 角 退 出 显示 区 域 。 在 流 模式 (F) 中 ， 图 片 做 常量 
运动 ， 从 右 下 角 进 ， 从 左上 角 出 。 

图 4-45 中 所 示 的 六 种 模式 各 自 的 优点 和 用 户 的 眼球 活动 习惯 紧密 联系 ， 因 此 我 们 接 下 来 要 
简要 介绍 一 下 人 类 的 视觉 行为 。 

眼球 活动 (Eye-gaze) 

当 我 们 凝视 显示 区 域 并 想 要 从 中 获得 信息 启示 时 ， 我 们 不 断 地 移动 眼球 ， 视 线 在 显示 图 片 
上 不 断 移 动 (Ware, 2004)。 人 类 的 眼球 活动 主要 分 为 扫 视 (saccade) 和 凝视 (fixation) 两 类 
(图 4-46) 。 扫 视 指 眼球 的 运动 ， 一 般 在 20~ 100 毫 秒 之 间 ， 类 似 弹 道学 原理 ， 扫 视 一 旦 开始 ， 
中 途 就 不 能 修改 。 凝 视 指 一 般 保 持 在 200~600 毫 秒 之 间 的 对 某 个 固定 点 的 注视 。 实 际 上 在 阅 
读 文字 的 过 程 中 我 们 对 扫 视 和 凝视 已 经 非常 熟悉 了 。 视 线 也 可 以 做 “平滑 的 追击 ”运动 ， 当 眼 
球 “ 锁 定 ” 一 幅 运 动 图 片 时 会 对 其 进行 跟踪 。 





图 4-46 恨 球 话 动 的 简单 示意 图 。 绿 色 表 示 快 速 扫 视 ， 圆 表示 凝视 (F)， 圆 的 大 小 表示 凝视 的 时 长 ( 见 彩 图 ) 


当 我 们 的 视线 固定 在 显 式 区 域 的 某 个 特定 位 置 时 ， 该 位 置 上 的 细节 信息 就 被 注册 在 了 视 网 
膜 的 中 心 四 点 上 。 在 角度 为 2 的 相对 方向 上 的 视觉 是 最 锐利 的 ， 在 该 区 域 以 外 我 们 只 能 识别 较 
大 的 物体 。 人 类 视觉 行为 的 另 一 个 特点 是 瞳孔 直径 ， 一 般 认 为 它 受 认 知 和 感知 行为 等 多 个 因素 
的 影响 。 

在 一 组 图 片 中 寻找 某 幅 特定 图 片 的 过 程 中 ， 可 以 利用 图 4-47 所 示 的 视线 探测 器 追踪 眼球 活 
动 。 安 全 的 红外 线 激光 束 对 准 每 只 眼睛 ， 摄 像 机 捕捉 视 网 腊 和 角膜 产生 的 反射 ， 经 过 处 理 后 就 
可 以 识别 眼球 凝视 的 位 置 。 





图 4-47 记录 眼球 话 动 的 设备 。 红 外 线 激光 束 对 准 用 户 的 眼睛 ， 摄 像 机 捕捉 视网膜 和 角膜 产生 的 
反射 。 该 设备 还 可 以 记录 瞳孔 直径 
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4.2.3 表示 模式 


Cooper 等 (2006) 对 图 4-45 所 示 的 三 种 静态 模式 和 三 种 活动 模式 的 优势 进行 了 研究 。 在 该 
研究 中 ， 要 求 参 与 者 判定 48 幅 图 片 中 是 否 出 现 一 幅 目标 图 片 9， 并 选择 他 们 最 喜欢 和 最 不 喜欢 
的 模式 。 实 验 结果 非常 有 启示 性 。 图 4-48 显 示 ， 对 于 判断 目标 图 片 是 否 出 现 ， 所 有 静态 模式 的 ”|1 人 5 
精确 度 均 高 于 活动 模式 ， 而 流 模式 的 精确 度 明显 低 于 其 他 模式 。 图 4-49 显 示 ，75% 的 参与 者 喜 L126 
爱 静 态 模式 (幻灯 片 模式 、 混 合 模式 和 堆 模 式 ) ， 只 有 25% 的 参与 者 喜爱 动态 模式 ， 没 有 人 喜 
爱 流 模 式 。 当 问 到 最 不 喜欢 的 模式 时 (图 4-50) ， 大 多 数 参与 者 选择 了 运动 模式 ， 而 流 模式 是 
所 有 运动 模式 中 最 不 受 欢 迎 的 。 
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图 4-48 对 图 4-45 的 所 有 任务 和 显示 时 长 取 平均 后 得 到 的 六 种 表示 模式 的 精确 度 (准确 判断 目标 
图 片 是 否 出 现 ) 
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图 4-49 3/4 的 参与 者 喜欢 《静态 ) 幻灯 片 、 混 合 和 4-50 几乎 所 有 受 欢 迎 的 模式 都 属于 运动 模式 ， 
HAR ( 见 彩 图 ) 超过 一 半 的 参与 者 不 喜欢 流 模式 ( 见 彩 图 ) 


在 本 研究 和 另 一 项 更 早期 的 实验 (Fawcett et al., 2004) 中 记录 下 的 眼球 活动 数据 特别 具 
有 启示 意义 。 图 4-51 显 示 了 一 些 非常 具有 代表 性 的 视线 轨迹 (绿色 表示 扫 视 ， F 表 示 凝 视 )。 在 


O 实验 中 使 用 了 3 种 图 片 描述 方式 。 对 于 给 定 的 图 片 集 表示 ， 向 用 户 : 1) 显示 目标 图 片 数秒 ，2) 用 特定 词语 
描述 该 图 片 (如 “ 猫 ") ，3) 用 一 般 词 语 描述 该 图 片 (如 “动物 ")。 实验 记录 了 3 种 不 同 的 图 片 显示 时 长 以 
比较 各 种 不 同 的 目标 图 片 显 示 方 法 对 实验 结果 的 影响 。 考 虑 到 著名 的 注意 瞬 脱 等 效应 ， 实 验 者 提前 对 用 户 
做 了 警告 。 更 多 细节 详 见 参考 文献 (Cooper er al., 2006), 
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幻灯 片 模式 (图 4-51a) 中 ， 凝 视 不 出 意外 地 都 集中 在 图 片 的 中 心 位 置 。 在 堆 模 式 (图 4-51b) 
中 ， 为 搜寻 目标 图 片 而 产生 的 视线 凝视 行为 和 预期 的 一 致 。 在 混合 模式 (图 4-51c) 中 ， 由 于 
用 户 可 以 对 四 幅 图 片 同 时 进行 评价 ， 这 样 就 避免 了 不 必要 的 视线 凝视 的 产生 ， 因 此 该 模式 下 控 
测 到 的 凝视 行为 较 少 。 混 合 模式 最 受 欢 迎 且 目标 识别 精确 度 最 高 。 下 面 我 们 来 看 看 运动 模式 。 
图 4-51d 和 图 4-51e 分 别 显示 了 不 喜欢 和 喜欢 对 角 线 (运动 ) 模式 的 两 位 参与 者 的 眼球 活动 跟踪 
数据 。 图 4-51d 和 图 4-51e 的 明显 差异 说 明 参 与 者 采用 的 视线 凝视 策略 不 仅 受 个 人 喜好 的 影响 ， 
也 受 目标 识别 表现 的 制约 。 值 得 注意 的 是 ， 图 4-5le 中 图 片 会 在 右 下 方 出 现 短暂 停留 ， 在 这 段 
时 间 内 ， 参 与 者 实际 进行 的 是 幻灯 片 模式 下 的 查看 ， 因 此 ， 凝 视 集中 于 该 “捕捉 ”位 置 。 类 似 





图 4-51 对 图 片 集 的 六 种 表示 模式 的 代表 性 眼球 活动 轨迹 的 数据 记录 : a) 幻灯 片 模式 ，b) HERE 
Xs c) BARR: d) 对 角 线 模式 (不 喜欢 该 模式 的 用 户 ) ，e) 对 角 线 模 式 (喜欢 该 模 
式 的 用 户 ) s f) 流 模式 (不 喜欢 该 模式 的 用 户 ) ( 见 彩 图 ) 


4.2.4 手动 控制 


到 目前 为 止 ， 我 们 的 所 有 讨论 都 基于 一 个 相同 的 假设 : 图 片 的 表示 速度 是 恒定 的 。 但 在 实 
际 应 用 中 ， 用 户 可 能 希望 对 速度 和 方向 均 实施 控制 。 对 速度 的 控制 使 得 用 户 可 以 快速 定位 曾经 
的 或 者 当前 的 目标 图 片 (例如 为 母亲 节 购 买 的 一 盒 巧克力 )， 因 此 出 现 了 很 多 手动 控制 的 技术 。 
我 们 在 图 4-40 的 悬浮 RSVP 技 术 和 图 4-41 的 拼 贴 画 RSVP 中 已 经 遇 到 过 手动 控制 技术 。 和 iPhoto 
的 传统 “滚动 堆 ” 模 式 类 似 ， 图 4-16 所 示 的 诺基亚 手机 的 图 片 库 也 允许 手动 控制 。 

另 一 种 手动 控制 的 表示 模式 可 以 建立 在 图 片 放 大 的 基础 上 。 如 图 4-52 所 示 ， 这 种 技术 应 用 
到 了 MacOSX 的 工具 栏 中 。 在 静止 状态 下 图 片 集 的 表示 可 以 非常 紧凑 ， 每 张 图 片 都 显示 为 其 缩 
略图 ， 这 样 整个 图 片 集 就 不 会 占用 太 多 的 显示 区 域 。 也 可 以 通过 图 片 重 登 来 保证 其 紧凑 性 。 当 
光标 滑 过 图 片 集 时 ， 各 张 图 片 依 次 放大 ， 这 样 可 以 让 用 户 比较 容易 地 判定 该 图 片 是 否 是 目标 图 
片 。 这 种 “目标 放大 ”表示 模式 的 潜在 优势 在 于 静止 和 放大 模式 所 占用 的 显示 区 域 均 较 小 。 在 
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极端 情况 下 ， 这 种 表示 技术 和 手动 控制 的 幻灯 片 模式 非常 类 似 。 回 顾 前 面 讨论 过 的 对 静态 和 运 
动 模式 的 实验 结果 ， 读 者 可 能 会 思考 ， 和 图 片 大 小 的 连续 扩大 相 比 , “从 缩 略 图 到 最 大 化 ”的 
动作 是 否 有 助 于 图 片 识别 ， 从 而 增强 用 户 对 该 模式 的 偏爱 程度 。 对 目标 放大 技术 的 深入 研究 可 
参见 参考 文献 (McGuffin and Balakrishnan, 2002) 。 


S Bid EH Heed La Ed Ea did 国志 
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图 4-52 目标 扩大 技术 。a) 图 片 集 的 静止 状态 ，b) 当 光 标 移动 到 第 6 张 图 片上 的 状态 


对 图 片 集 的 手动 控制 和 自动 表示 都 属于 复杂 的 设计 任务 。 在 这 两 种 情况 下 都 可 以 考虑 运用 
前 面 介 绍 过 的 眼球 活动 知识 。 对 支持 各 种 任务 的 图 片 集 表示 方式 的 研究 是 当前 的 热点 课题 之 一 ， 
可 参见 参考 文献 (Cockburn et al., 2006)。 


4.2.5 人 类 视觉 行为 模式 


虽然 我 们 已 经 积累 了 关于 图 片 表示 模式 的 大 量 经 验 ， 但 是 尚 缺 乏 对 人 类 视觉 行为 模式 (该 
模式 和 信息 可 视 化 有 着 更 为 密切 的 相关 性 ) 的 深入 认识 。 我 们 认为 有 必要 对 其 做 一 些 基本 讨论 。 
例如 ， 图 4-43 所 示 的 实验 (Potter and Levy, 1969) 显示 ， 即 使 事先 没有 看 过 目标 图 片 ， 用 户 
仍然 可 以 有 效 地 记 住 10 张 甚至 更 多 的 图 片 ， 进 而 可 以 精确 地 回答 里 面 是 否 出 现 了 某 张 图 片 
(图 4-53)。 当 然 ， 前 提 是 用 户 必须 在 图 片 集 播放 完成 之 后 的 几 秒 钟 内 就 回答 问题 (Potter, 
1976; Potter et al., 2002) 。 也 许 令 人 感到 意外 的 是 ， 图 片 显示 的 短暂 性 (例如 100 毫 秒 ) 和 几 
秒 过 后 用 户 记忆 的 短暂 性 之 间 没 有 必然 的 因果 关系 。 图 4-54 所 示 的 另 一 项 实验 显示 (Potter, 
1976; Intraub, 1980)， 如 果 每 张 图 片 的 表示 之 间 插 入 一 个 间隔 300 毫 秒 的 “视觉 掩 码 ”(visual 
mask)， 用 户 对 图 片 集中 是 否 出 现 目 标 图 片 的 回答 精确 度 将 大 大 提高 。 


对 参与 者 的 事 
前 指导 





参与 者 行为 


a 图 片 集 播放 完 后 ， 向 参与 者 展示 一 张 图 
片 ， 要 求 他们 回答 “该 图 片 是 否 出 现在 
你 刚 看 过 的 图 片 集中 ?” 


不 相关 的 图 片 





除非 在 图 片 集 播 放 完 的 4 种 内 就 对 参与 者 
pl le- 提问 ， 否 则 正确 识别 率 只 有 10% ~ 20% 


KH) 100% 
图 4-53 在 本 实验 中 ， 参 与 者 首先 观看 一 组 快速 切换 的 图 片 (每 秒 显 示 10 张 图 片 )， 然 后 观看 一 张 
单独 的 图 片 ， 要 求 回答 该 图 片 是 否 在 这 组 图 片 中 出 现 过 。 识 别 率 高 度 依赖 于 图 片 显示 结 
束 和 向 参与 者 提问 之 间 的 时 间 间 隔 
实验 者 和 交互 设计 师 需要 注意 的 另 一 个 问题 是 注意 瞬 脱 (Raymond et al., 1992)。 对 于 含 
有 以 前 曾 看 过 的 图 片 的 图 片 集 ， 在 幻灯 片 出 现 前 告诉 用 户 “目标 图 片 出 现在 黄色 圆 环 和 红色 方 
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块 后 "”。 如 果 这 两 张 图 片 的 出 现 间隔 在 300 毫 秒 内 ， 上 有 目标 图 片 将 被 忽略 。 


对 参与 者 的 
事前 指导 





参与 者 行为 










图 片 集 播放 完 后 ， 向 参与 者 展示 一 张 图 
片 ， 要 求 他 们 回答 “该 图 片 是 否 出 现在 
你 刚 看 过 的 图 片 集中 ? ” 










不 相关 的 图 片 时 间 


等 


a i a 


大 约 100 毫 秒 ”大 约 300 毫 秒 





回答 正确 率 可 高 达 92% 





4-54 本 实验 向 参与 者 展示 一 个 图 片 集 。 每 张 图 片 的 显示 时 间 较 短 (大 约 100 毫 种 ) ， 每 张 图 片 
显示 结束 后 都 插入 一 个 大 约 300 毫 秒 的 “视觉 掩 码 ” 。 在 图 片 集 播放 完毕 后 ， 参 与 者 对 
“ 某 张 图 片 是 否 出 现在 该 图 片 集 ” 的 回答 正确 率 大 大 提高 


在 大 量 关 于 人 类 视觉 行为 模式 的 文献 中 ，Coltheart (1999a) 提供 了 一 个 很 好 的 导论 ， 该 
文章 提出 的 观点 有 助 于 加 深 对 信息 可 视 化 的 理解 。 在 看 到 图 片 或 听 到 声音 的 那 一 时 刻 和 接 下 来 
的 一 秒 钟 之 间 的 人 类 视觉 和 听觉 行为 同 信 息 可 视 化 的 相关 活动 联系 密切 ， 这 些 行为 发 生 在 我 们 
熟悉 的 短期 记忆 (Short-Term Memory, STM) 和 长 期 记忆 (Long-Term Memory, LTM) 之 前 。 
为 了 表征 这 个 特定 时 间 段 内 的 人 类 行为 模式 ，Potter (1993, 1999) 提出 了 概念 型 短期 记忆 
(Conceptual Short-Term Memory, CSTM) 这 一 概念 。 


4.2.6 交互 设计 
在 第 3 章 末 尾 处 我 们 总 结 了 交互 设计 师 的 两 个 调 色 板 。 本 章 中 介绍 的 数据 表示 的 概念 和 相 


关 技术 填补 了 第 3 个 调 色 板 ( 见 图 4-55)。 如 本 章 中 的 例子 所 示 ， 设 计 决 策 和 数据 描述 、 数 据 表 
示 之 间 有 着 深刻 的 相互 影响 关系 。 第 5 章 的 内 容 将 补充 交互 设计 师 的 第 4 个 调 色 板 。 





图 4-55 交互 设计 师 的 第 3 个 强调 数据 表示 的 调 色 板 


习题 
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建议 通过 课堂 讨论 的 形式 来 加 深 对 以 下 习题 的 理解 。 


4.1 


(复习 题 ) 分 别 用 一 句 话 来 描述 以 下 各 种 数据 表示 方法 的 本 质 特点 : 
(1) 滚动 ，(2) 总 图 + 细节 ，(3) 变形 ，(4) 抑制 ，(5) 缩放 和 平移 。 


4.2 (复习 题 ) 使 用 双 焦 显示 有 什么 意义 ?使 得 该 技术 具有 潜在 吸引 力 的 关键 特点 是 什 


4.3 


4.4 


4.5 


4.6 
4.7 


4.8 


么 ? 在 实际 应 用 中 使 用 该 技术 可 能 会 遇 到 哪些 问题 ? 

假设 你 的 PPDA 有 内 媒 式 GPS， 因 此 随时 可 以 查看 “当前 位 置 "。 画 出 一 幅 带 街道 名 字 
的 街道 地 图 的 设计 草图 。 设 显示 范围 为 PDA 显 示 区 域 的 9 倍 大 ， 要 求 显 示 该 区 域内 的 
当前 大 致 位 置 以 及 感 兴趣 的 对 象 (如 饭店 、 加 油 站 等 ) 。 

研究 如 何 利用 变形 技术 来 支持 用 户 的 手机 信息 发 送 ， 同 时 允许 用 户 关注 其 他 感 兴趣 的 
MR (如 通话 记录 和 文本 信息 等 )。 展 示 如 何 利用 颜色 、 位 置 和 其 他 编码 技术 来 增强 
系统 的 可 用 性 。 注 意 将 变形 区 域内 的 图 片 大 小 调整 为 最 小 值 。 


. 假设 城市 旅游 局 计划 为 旅客 或 专业 人 士 提供 城市 地 图 〈 例 如 荷兰 的 埃 因 霍 温 、 英 国 的 


约克 、 德 国 的 康 斯 坦 效 、 挪 威 的 奥斯陆 、 美 国 的 波士顿 和 西雅图 等 )， 要 求 地 图 内 包 
含 当 地 交通 、 景 点 、 距 离 本 市 50 ~200 公 里 的 其 他 城市 的 主要 交通 枢纽 信息 。 研 究 可 
供 游 客 或 专家 使 用 的 城市 地 图 的 适合 尺寸 ， 并 画 出 基于 总 图 + 细节 技术 的 可 能 的 设计 
草图 。 讨 论 你 的 设计 的 优 缺 点 。 

重复 习题 4.5， 使 用 变形 技术 来 确保 本 地 和 全 局 信息 的 连续 性 。 

图 4-56 展 示 了 习题 4.5 的 一 种 可 能 的 解决 办 法 。 该 方法 以 牺牲 地 理 精确 度 换取 了 文化 、 
交通 、 娱 乐 等 各 种 活动 的 分 类 表示 。 十 字 路 口 图 标 表示 步行 距离 。 针 对 你 在 习题 4.5 
中 选 定 的 城市 ， 将 该 设计 补充 完整 ， 并 讨论 其 优 缺 点 。( 图 片 感谢 Roel Vossen 惠 人 允 。) 





图 4-56 习题 4.5 的 一 个 初始 解决 方案 


图 4-57 展 示 了 习题 4.5 的 另 一 种 可 能 的 解决 办 法 。 该 图 中 的 总 图 和 细节 通过 中 央 火 车 站 
进行 连接 。 为 你 选择 的 城市 完成 该 设计 并 讨论 其 优 缺 点 。( 图 片 感谢 Oliver Moran 惠 允 ) 


(133) 
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134 图 4-57 对 习题 4.5 的 “总 图 + 细节 ”的 解决 方案 
4.9 图 4-58 展 示 了 习题 4.6 的 一 种 解决 办 法 。 用 “游客 魔方 ”的 方式 向 游客 呈现 城市 的 总 
图 和 细节 信息 。 魔 方 的 一 面 表示 局 部 细节 ， 其 他 面 展 示 相 关 的 上 下 文 信 息 。 讨 论 如 何 
保证 不 同 面 边界 处 的 连续 性 ， 为 你 在 习题 4.5 中 选 定 的 城市 完成 该 设计 并 讨论 其 优 缺 
点 。( 图 片 感谢 Maurits Kaptein 惠 人 允 。) 


— AS 
公交 车 peen 











图 4-58 习题 4.6 的 一 种 可 能 的 解决 办 法 (见习 题 4.9) ( 见 彩 图 ) 
4.10 假设 用 户 想 从 至 多 500 张 照片 中 找到 一 张 合适 的 给 朋友 看 ， 请 为 此 设计 一 个 应 用 系统 。 


4.11 内 容 众 多 的 树 图 不 能 一 次 性 地 显示 在 PDA 屏 幕 上 。 请 为 PDA 上 的 树 图 浏览 设计 一 个 
135 应 用 系统 。 
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通过 交互 改变 数据 集 的 用 户 视图 会 带 来 很 多 的 好 处 ， 因 此 用 户 和 计算 机 之 间 的 交互 成 为 现 
代 信息 可 视 化 的 核心 。 数 据 集 通常 都 很 大 ， 因 此 一 般 情 况 下 不 存在 能 包括 一 切 并 且 能 带 来 信息 
启示 的 视图 。 用 户 想 要 获取 信息 启示 就 必须 对 数据 集 的 某 一 子 集 进 行 交 互 式 的 探查 ， 以 期 找到 
可 以 触发 信息 启示 的 视图 。 

虽然 很 多 时 候 交 互 对 信息 可 视 化 是 非常 重要 的 ， 但 是 还 存在 着 一 些 问 题 。 例 如 ， 交 互 涉及 
一 系列 的 动作 : 不 仅 是 点 击 鼠标 等 物理 动作 ， 而 且 包 括 对 所 见 进行 解释 从 而 增强 心理 模型 的 认 
知 成 本 。 这 样 的 动作 是 否 有 用 ? 是 否 需要 修正 ? 是 否 存在 不 同类 别 的 交互 技术 ? 如 果 存 在 ， 是 
否 需要 对 不 同 的 交互 技术 应 用 不 同 的 设计 指导 原则 ? 是 否 存在 使 某 些 交互 技术 优 于 其 他 技术 的 
数据 集 ? 是 否 存在 使 某 些 交 互 技术 优 于 其 他 技术 的 任务 ? 

要 回答 关于 交互 设计 的 这 些 问 题 ， 最 好 首先 讨论 一 下 用 户 和 系统 之 间 典 型 的 交互 形式 。 在 
此 基础 上 ， 我 们 将 尝试 着 通过 分 类 来 讨论 有 关 交 互 的 一 些 实质 性 问题 。 
交互 场景 

在 第 一 个 场景 中 ， 用 户 走 向 Minard 地 图 (图 5-1)， 迅 速 为 显示 区 域 中 的 大 部 分 已 编码 数据 
建立 起 一 个 心理 模型 。 用 户 不 需要 做 出 任何 物理 举动 ， 由 于 地 图 是 静止 的 ， 因 此 用 户 可 以 立即 


读 取 其 中 的 已 编码 数据 。Minard 地 图 中 的 信息 是 “醒目 ”的 ， 但 在 其 他 的 案例 中 可 能 需要 对 用 
户 进行 培训 以 帮助 用 户 理解 数据 编码 方案 。 





图 5-1 静止 图 片 ， 不 需要 物理 交互 ， 已 编码 数据 立即 可 见 


在 另 一 个 场景 (scenario) 中 ， 一 对 夫妇 在 查找 伦敦 市 内 的 各 种 娱乐 活动 。 他 们 首先 访问 
了 一 个 在 线 娱乐 向 导 系 统 的 首页 (图 5-2)， 该 页 面 推荐 了 各 种 娱乐 活动 。 当 选中 某 一 类 娱乐 活 
动 (如 电影 ) 后 ， 接 下 来 还 有 一 系列 页 面 可 帮助 用 户 逐 步 确定 自己 的 需求 。 最 终 ， 在 可 能 的 几 
步 回溯 操作 后 ， 用 户 做 出 了 决定 。 在 这 个 例子 中 ， 需 要 通过 类 似 “ 和 鼠标 点 击 ”的 交互 动作 在 离 
X (discrete) 信息 空间 内 的 页 面 之 间 来 回 移动 。 在 每 个 页 面 中 用 户 都 会 进行 分 析 和 决策 ， 整 
个 过 程 可 以 称 为 “渐进 式 交互 ”。 
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图 5-2 离散 信息 空间 ， 渐 进 式 交互 


在 第 三 个 场景 中 ， 一 位 专业 的 房地产 经 纪 人 使 用 属性 浏览 器 (图 5-3) 向 顾客 进行 住房 推 

137] 荐 。 顾 客 对 住房 属性 的 要 求 在 其 和 专业 人 士 的 对 话 中 逐渐 清晰 起 来 。 在 某 个 时 刻 ， 顾 客 可 能 会 
问 “ 如 果 提 高 预算 会 怎样 呢 ?”。 经 纪 人 可 以 通过 改变 价格 上 限 来 手动 观察 符合 所 有 条 件 的 住 

房 变 化 情况 。 由 于 限制 条 件 的 变化 能 在 该 系统 中 得 到 直接 的 反映 , 因此 这 样 的 探 察 是 很 有 用 的 。 





图 5-3 离散 信息 空间 ， 连 续 交 互 ， 即 时 反应 系统 

在 第 四 个 场景 中 ， 人 们 围 坐 在 桌子 旁 喝 咖 啡 、 吃 甜 甜 圈 、 讨 论 最 新 的 影片 。 但 是 这 张 咖 啡 
桌 不 是 普通 的 桌子 (Living Memory, 2000; Stathis et al., 2002) , 它 的 表面 是 LCD 显 示 器 (图 5-4)， 
显示 区 域内 有 一 些小 图 片 在 做 缓慢 的 曲线 运动 。 这 些 图 片 可 能 是 加 上 了 短语 的 本 地 公众 活动 的 
宣传 照片 ， 如 锦标 赛 或 者 动物 丢失 启示 等 。 在 谈话 过 程 中 可 能 会 出 现 这 样 的 情景 ， 某 人 无 意 间 
看 到 了 一 张 感 兴趣 的 图 片 ， 在 不 干扰 当前 谈话 的 前 提 下 ， 他 可 以 用 手指 使 这 张 图 片 脱离 原来 的 
曲线 轨迹 。 这 张 图 片 会 放大 ， 内 容 变 得 更 详细 ( 见 图 $-4) 。 大 家 可 以 评论 这 张 图 片 ， 如 果 是 大 
家 感 兴趣 的 话题 ， 该 图 片 可 以 作为 该 用 户 的 标记 ， 被 “放置 ”到 桌子 中 央 的 位 置 。 在 短暂 的 停 
顿 后 ， 交 谈 可 以 继续 进行 (de Bruijn and Spence, 2001), 

在 这 个 咖啡 桌 场 景 中 ， 在 用 手指 将 小 图 片 移 向 桌子 中 央 前 ， 没 有 任何 物理 交互 产生 ， 咖 啡 
桌 四 周 的 人 们 也 不 需要 做 任何 动作 。 如 果 一 张 图 片 引 起 了 人 们 的 兴趣 ， 可 视 化 就 产生 了 。 显 示 
屏 上 缓慢 移动 的 图 片 构成 了 一 个 离散 的 信息 空间 。 多 数 时 候 对 图 片 感 兴趣 是 随机 的 ， 而 不 是 事 
先 设 定 的 。 
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图 5-4 离散 信息 空间 ， 移 动 的 图 片 ， 无 物理 交互 


在 最 后 一 个 场景 中 ， 一 位 数字 电路 设计 师 想 要 检查 某 个 部 件 属 性 的 改变 对 整个 电路 性 能 的 
影响 (Spence and Apperley, 1974, 1977) 。 该 设计 师 向 系统 传送 信号 ， 想 要 检查 放大 器 在 基数 
和 三 倍 基数 范围 内 的 放大 对 某 个 部 件 的 影响 效果 。 经 过 一 段 时 间 的 计算 后 ， 设 计 师 可 以 通过 鼠 
标 拖 动 请 块 (图 5-5) 来 手动 平滑 地 改变 部 件 属性 。 该 部 件 当前 值 所 对 应 的 放大 值 和 频率 会 立 
即 反 映 在 左边 的 曲线 图 中 。 通 过 交互 ， 设 计 师 可 以 更 好 地 构建 心理 模型 ， 也 可 以 为 该 部 件 选 定 
一 个 最 适当 的 值 ， 使 得 整个 电路 的 性 能 处 于 最 佳 状态 。 在 这 个 例子 中 ， 设 计 师 探 察 了 一 个 连续 
(continuous) 的 信息 空间 ， 并 且 受 益 于 一 个 反应 非常 及 时 的 系统 。 


10 
放大 值 


图 5-5 连续 性 交互 ， 连 续 关 系 ， 即 时 反应 ， 可 能 会 需要 前 期 计算 


空间 、 交 互 和 控制 平衡 


我 们 可 以 从 以 上 这 些 涉及 信息 可 视 化 活动 的 场景 中 得 到 什么 启示 ? MAHER, KDR 
具有 一 些 共同 的 特点 ， 这 些 特点 构成 了 交互 分 类 的 基础 ， 从 而 可 以 为 交互 设计 师 提 供 一 些 基 本 
的 概念 和 技术 。 

信息 空间 

首先 ， 我们 观察 到 了 两 类 信息 空间 (图 5-6)。 在 娱乐 向 导 系 统 例子 (图 5-2) 和 咖啡 桌 实 
例 (图 5-4) 中 ,信息 被 有 意识 地 划分 为 多 个 离散 实体 的 集合 ， 属 性 浏览 器 的 直方 图 也 是 由 离 
散 元 素 组 成 的 ， 每 个 元 素 对 应 于 一 栋 住 房 。 万 维 网 也 是 离散 信息 空间 。 相 对 而 言 ， 数 字 电路 设 
计 例 子 (图 5-5) 中 涉及 的 是 连续 信息 空间 : 电路 性 能 和 属性 可 变 的 部 件 之 间 存 在 着 连续 的 数 
学 关系 。Minard 地 图 可 以 视 为 特殊 的 只 包含 一 个 元 素 的 离散 信息 空间 。 考 虑 到 它 是 某 个 更 大 的 


138 
1 
139 


104 "第 5 章 & H 


数据 表示 的 一 个 部 分 ， 也 可 以 划分 到 连续 空间 类 别 中 。 





连续 
信息 空间 
图 5-6 两 类 信息 空间 


交互 模式 


抛 开 信息 空间 的 实质 差别 ， 我 们 已 经 看 到 了 用 户 与 空间 有 大 量 不 同 的 交互 方式 。 通 过 以 上 
例子 可 以 看 到 计算 机 和 用 户 之 间 存 在 着 多 种 控制 平衡 。 它 有 助 于 对 交互 模式 的 本 质 特 性 做 分 类 
(Tweedie, 1997) 。 我 们 主要 讨论 三 类 交互 模式 9。 

设计 师 对 电路 中 某 个 部 件 和 整个 电路 性 能 之 间 的 功能 性 关系 的 探 察 (图 5-5) 展示 了 连续 
交互 (continuous interaction) 模式 。 但 其 他 很 多 情况 下 并 不 存在 这 样 的 连续 数学 关系 。 该 分 
类 可 以 扩展 到 属性 浏览 器 (图 5-3) 这 样 的 例子 。 虽 然 该 系统 基于 离散 信息 空间 ， 但 是 用 户 还 
是 可 以 在 该 空间 内 进行 连续 的 移动 : 从 用 户 角度 来 看 ， 输 入 设备 的 颗粒 度 (属性 限定 条 件 指 示 
器 ) 和 数据 表示 (直方 图 ) 等 交互 结果 都 可 以 看 做 是 连续 功能 (图 5-7)。 即 使 系统 引入 时 长 为 
1 秒 的 延迟 ， 用 户 仍然 可 能 将 活动 视 为 连续 的 (Goodman and Spence, 1978) 。 

我 们 可 以 通过 娱乐 向 导 例 子 (图 5-2) 和 对 万 维 网 的 体验 来 讨论 渐进 式 交 互 (stepped 
interaction) 模式 。 在 这 类 交互 中 ， 诸 如 鼠标 点 击 等 小 动作 可 以 在 离散 信息 空间 内 不 同 地 点 间 
来 回转 换 (图 5-7) 。 


。 娱乐 向 导 
万 维 网 


~~ s = k 
e s a 


连续 离散 
信息 空间 交互 模式 








图 5-7 信息 空间 、 交 互 模式 以 及 两 者 的 结合 示例 〈 见 彩 图 ) 


O 对 用 户 和 视觉 显示 之 间 的 交互 方式 的 分 类 方法 有 很 多 。 描 述 诸如 在 显示 区 域内 通过 鼠标 点 击 或 拖 动 来 重 置 
物体 位 置 等 交互 行为 的 同义词 有 很 多 ， 如 “手动 "、“ 直 接 控 制 "、“ 直 接 投入 ”等 。 在 同样 的 语 境 下 ， 
Norman (1988) 使 用 的 术语 是 “第 一 人 ”或 “亲自 动手 "。Dix 等 (1998) 对 于 该 类 交互 的 评论 是 “在 用 户 
和 世界 之 间 (显然 ) 是 没有 中 间 媒 介 的 ”。 
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要 对 观察 Minard 地 图 (图 5-1) 或 喝 咖啡 时 偶然 看 到 一 张 有 趣 图 片 (图 5-4) 所 产生 的 用 户 
交互 (实际 上 几乎 “没有 交互 ”产生 ) 进行 分 类 是 非常 具有 挑战 性 的 。 我 们 可 以 使 用 被 动 式 交 
% (passive interaction) 这 个 听 起 来 也 许 比 较 矛 盾 的 术语 。 交 互 (interaction) 一 词 的 前 缀 
“inter” 表 示 “ 在 …… 之 间或 之 中 ”， 而 “act” 表 示 完 成 某 件 事 情 的 过 程 。 例 如 ， 社交 活动 是 
很 复杂 的 过 程 ， 其 间 可 能 没有 发 生 任何 物理 动作 ， 因此 可 以 用 被 动 式 交互 来 形容 人 们 观察 
Minard 地 图 时 产生 的 非常 复杂 的 视觉 和 认 知 行为 。 我 们 可 以 看 到 ， 被 动 一 词 并 不 总 是 意味 着 像 
Minard 地 图 一 样 的 静态 显示 : 显示 可 以 是 动态 的 ， 它 有 助 于 用 户 在 观察 过 程 中 获取 大 量 的 信息 
启示 ( 见 5.4 节 ) 。 被 动 式 交互 也 可 以 叫做 “视觉 交互 ”(visual interaction) 或 “感官 交互 ” 
(sensory interaction) 。 

虽然 将 交互 模式 分 为 连续 、 渐 进 和 被 动 这 三 类 的 分 类 方式 是 很 有 用 的 ， 实际 上 很 多 信息 可 
视 化 工具 使 用 了 这 些 模 式 的 混合 体 ， 因此 我 们 把 这 种 交互 模式 称 为 混合 型 交互 (composite 
interaction) ( 见 图 5-7) 。 


用 户 意图 


在 介绍 了 信息 空间 和 交互 模式 后 ， 我 们 接 下 来 讨论 用 户 意图 。 例 如 ， 电 路 设计 师 (图 5-5) 
可 能 在 任意 时 刻 为 模拟 关系 建立 心理 模型 而 进行 探查 。 他 通过 这 样 的 方式 来 对 关系 或 信息 空间 
进行 学 习 ， 这 样 的 探 察 需求 激发 或 引导 了 交互 的 产生 。 另 一 种 情况 ， 用 户 可 能 会 查找 某 个 特定 
目标 ， 这 时 用 户 的 意图 是 寻找 ， 而 随 着 用 户 对 信息 空间 了 解 的 深入 ， 用 户 心中 的 目标 可 能 随时 
重 定 义 。 还 有 一 种 情况 : 用 户 并 没有 特定 的 目标 ， 只 是 想 看 看 信息 空间 中 “有 些 什么 "， 这 样 
的 活动 可 以 称 为 随机 (opportunistic) 的 。 在 咖啡 桌 的 例子 (图 5-4) 中 ， 停 留 在 某 张 图 片上 的 
目光 可 能 是 无 意 (involuntary) 的 ， 只 是 随处 扫 视 的 过 程 中 暂停 了 几 秒 的 结果 ， 而 这 样 的 无 意 
活动 可 能 会 引起 观察 者 的 注意 ! 

浏览 (也 称 为 “仔细 观察 ”) 是 涉及 内 容 (包括 定位 线索 ) 的 (通常 是 视觉 的 ) 感知 和 翻 
译 活动 。 根 据 内 容 可 以 很 方便 地 将 浏览 行为 限定 为 探 察 式 (exploratory) 浏览 、 寻 找 式 浏览 、 
随机 式 或 无 意 式 浏览 。 


本 章 内 容 


我 们 已 经 讨论 了 交互 的 三 个 方面 : 信息 空间 的 本 质 、 向 用 户 提供 的 交互 模式 以 及 交互 背后 
的 总 图。 用 户 意图 及 相关 的 认 知 过 程 不 在 本 书 的 讨论 范围 内 ， 因 此 在 此 不 做 详细 讨论 。 同 样 ， 
由 于 对 信息 空间 的 描述 通常 是 既成 享 实 (fait accompli) 的 ， 在 此 我 们 也 不 讨论 。 我 们 在 本 章 
中 主要 讨论 各 种 可 用 交互 模式 的 特点 ， 以 及 为 交互 设计 师 提供 的 各 种 可 能 性 。 

我 们 尚未 回答 的 一 个 问题 是 “是 否 存在 为 所 有 交互 模式 提供 系统 思考 的 交互 框架 ? ”。 幸 
运 的 是 ， 的 确 存在 这 样 的 框架 : 我 们 将 在 5.1 节 中 介绍 Norman 动 作 周 期 (Action Cycle) 的 概 
念 。 也 许 会 令 读者 感到 意外 的 是 ， 这 个 概念 和 我 们 讨论 过 的 无 交互 的 “被 动 式 交互 ”场景 相关 。 
， 在 介绍 交互 框架 的 基础 上 ， 我 们 将 讨论 交互 模式 的 分 类 ， 并 分 别 在 5.2 节 、5.3 节 和 5.4 节 中 对 连 
续 、 渐 进 和 被 动 这 三 类 主要 的 交互 模式 进行 介绍 。 考 虑 到 混合 型 交互 模式 的 潜力 ， 我 们 将 在 
5.5 节 中 对 其 进行 讨论 。5.6 节 主要 讨论 信息 可 视 化 核心 的 “视图 变换 ”的 动态 性 实质 ， 所 有 的 
讨论 围绕 着 两 个 中 心 问题 “变换 应 该 多 快 或 多 慢 ? ”和 “我 们 能 对 变换 的 实质 进行 有 效 的 设计 
吗 ? ”。 我 们 将 在 最 后 一 节 中 强调 交互 设计 的 难度 。 
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5.1 交互 框架 


许多 支持 人 机 交互 的 交互 设计 都 曾经 从 Donald Norman (1988) 提出 的 动作 周期 (Action 
Cycle) 框架 中 受益 。Norman 定 义 了 存在 于 想 要 达成 某 个 目标 的 用 户 和 为 达成 这 个 目标 所 必须 
改变 的 “世界 ”( 通 常 是 计算 机 ) 之 间 的 两 个 “海湾 "。 由 于 这 个 概念 的 目标 是 一 个 有 用 的 心理 
模型 ， 并 且 必 须 改 变 的 “世界 ”意味 着 对 数据 的 某 些 (视觉 或 听觉 的 ) 描述 ， 因 此 和 信息 可 视 
化 有 着 直接 的 联系 。 

图 5-8 所 示 的 “执行 海湾 ”(Gulf of Execution) 反映 了 为 改变 世界 (在 信息 可 视 化 的 范围 
内 指数 据 描述 ) 而 执行 的 操作 , “评估 海湾 ”(Gulf of Evaluation) 反映 了 对 世界 变化 的 解释 和 
评估 问题 。 每 个 海湾 由 三 个 活动 组 成 (图 5-8) 。 我 们 将 看 到 ， 即 使 是 相机 这 样 非常 简单 和 常见 
的 工具 ， 如 果 交 互 设计 不 能 支持 这 些 活动 将 带 来 很 严重 的 后 果 。 


执行 海湾 评估 海湾 





图 5-8 Norman 动 作 周 期 


在 相机 一 例 中 ， 用 户 的 目标 是 对 某 个 事件 做 影像 记录 。 这 样 用 户 就 形成 了 意图 去 使 用 相机 
(而 不 是 雇用 一 个 摄影 师 或 艺术 家 )。 接 下 来 的 步骤 是 形成 一 个 行动 计划 。 前 两 个 步骤 均 只 涉及 
认 知 成 本 。 对 于 相机 ， 用户 需要 决定 用 相机 的 哪个 部 位 朝向 被 摄 对 象 , 以 及 应 该 按 下 哪个 按钮 。 
对 用 户 而 言 ， 做 出 这 些 决定 并 非 总 是 容易 的 。 例 如 ， 旧 款 相机 的 取景 框 和 镜头 控制 复杂 ， 导 致 
很 多 拍摄 出 来 的 胶片 都 是 失 焦 的 。 执 行 海湾 中 的 最 后 一 步 是 物理 的 拟定 计划 的 执行 。 在 相机 一 
例 中 快门 释放 便 是 执行 动作 。 某 些 品牌 的 相机 在 没有 放置 胶片 的 情况 下 也 人 允许 计划 的 “执行 ” 
( 即 释放 快门 ) 。 

执行 操作 可 能 改变 也 可 能 不 会 改变 世界 。 如 果 世 界 变化 了 ， 接 下 来 就 进入 评估 海湾 ， 其 第 
一 步 是 对 变化 的 感知 。 按 下 快门 后 用 户 能 感知 到 的 变化 通常 是 按钮 “ 按 下 ”的 声音 ， 或 者 是 取 
景 框 中 的 空白 。 这 样 ， 用 户 所 感知 到 的 变化 就 得 到 了 解释 。 按 键 声 可 以 提示 胶片 是 否 曝光 正常 ， 
也 可 以 表示 快门 的 开 和 关 。 但 是 听 到 同一 种 声音 时 ， 用 户 可 能 无 法 正确 判断 这 种 声音 是 胶片 还 
是 快门 操作 产生 的 。 执 行 海 湾 的 最 后 一 步 是 对 已 发 生 事件 的 评估 。 数 码 相机 的 评估 是 实时 的 ， 
可 以 及 时 实施 相应 的 修正 措施 。 但 如 果 照 相 的 人 忘记 了 装 胶片 ， 这 个 错误 可 能 不 会 马上 被 发 现 。 
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相机 一 例 说 明 交互 设计 师 可 以 把 动作 周期 看 做 是 一 张 动作 清单 或 整理 思维 的 基础 。 我 们 在 
5.2 节 和 5.3 节 中 将 在 这 个 框架 的 基础 上 对 连续 式 交互 和 渐进 式 交 互 进行 分 析 。 在 5.4 节 中 我 们 将 
看 到 动作 周期 的 一 部 分 (其实 是 只 包含 了 执行 海湾 的 那 部 分 ) 和 被 动 式 交 互 的 关系 。5.5 节 将 
讨论 混合 型 交互 ，5.6 节 将 讨论 动作 周期 中 关于 “世界 变化 ”的 部 分 。 


5.2 连续 式 交 互 


连续 式 交互 并 不 是 一 个 新 概念 。 自 从 Sutherland (1963) 的 开创 性 研究 SKETCHPAD 黄 定 
了 交互 式 图 形 的 基础 后 ， 连 续 式 交互 的 研究 成 果 不 断 涌现 。 早 期 的 例子 多 出 现在 统计 学 领域 
(Fowlkes, 1969)， 例 如 转动 旋钮 使 同 概率 曲线 相关 的 形状 参数 发 生 连 续 变 化 。 前 面 提 到 过 的 
数字 电路 设计 是 目前 一 个 较 典型 的 例子 。Newton (1978) 和 Becker、Cleveland (1987) 等 人 
也 分 别 进行 过 这 方面 的 研究 。 随 着 计算 资源 和 显示 技术 的 普及 以 及 计算 能 力 的 提高 ， 
Williamson#fiShneiderman (1992) 提出 了 对 连续 式 交互 的 极 具 冲 击 性 的 示例 。 

为 了 讨论 连续 式 交 互 的 相关 概念 ， 我 们 选择 第 3 章 中 介绍 过 的 属性 浏览 器 (用 作 房 屋 购买 
中 的 住房 查找 ) 作为 主要 研究 对 象 来 讨论 Norman 动 作 周 期 如 何 为 交互 设计 提供 指导 。 

Norman 动 作 周 期 里 的 第 一 步 是 形成 意图 。 根 据 采 用 的 策略 和 已 有 心理 模型 ， 用 户 可 能 形 
成 各 种 不 同 的 意图 。 交互 设计 师 应 该 确保 用 户 清楚 所 有 可 能 的 选择 。 这样 的 意识 是 可 以 增强 的 ， 
例如 ， 为 直方 图 加 上 清晰 的 标签 ， 以 及 清晰 地 显示 当前 的 限制 条 件 。 一 个 可 能 的 意图 是 想 了 解 
改变 价格 限制 条 件 所 导致 的 变化 ， 另 一 个 可 能 的 意图 是 观察 “ 湖 边 房 屋 的 价格 ”。 

执行 海湾 的 第 二 个 阶段 形成 行动 计划 通常 是 很 具有 挑战 性 的 。 例 如 ， 交 互 设 计 师 必须 保证 
用 户 明白 如 何 调整 价格 的 上 下 限 。 早 期 的 属性 浏览 器 〈 图 5-9) 就 犯 了 这 个 错误 : 有 的 用 户 认 
为 鼠标 移动 到 上 限 箭头 上 (图 5-9) 就 可 以 实现 对 上 限 值 的 修改 。 但 实际 上 正确 的 操作 是 鼠标 
移动 + 拖 动 。 有 很 多 方法 可 以 对 其 进行 改进 ， 使 得 它 的 使 用 方法 对 用 户 而 言 更 加 明确 : 例如 ， 
如 图 5-10 所 示 ， 可 以 在 鼠标 悬 停 时 出 现 对 应 的 悬 停 效果 。 





只 需要 按 下 鼠标 还 是 需要 在 
按 下 鼠标 的 同时 拖 动 它 ? 


图 5-9 改变 上 下 限时 产生 的 歧义 





图 5-10 消除 图 5-9 所 示 歧 义 的 一 种 办 法 。 鼠 标 悬 停 效 果 提示 可 能 的 操作 
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执行 是 系统 界面 必须 保证 的 第 三 个 阶段 。 在 保证 连续 式 交互 的 很 多 系统 中 会 涉及 一 系列 的 
执行 步骤 ， 例 如 每 次 将 价格 属性 限制 移动 一 小 格 。 执 行 的 推动 看 起 来 是 琐碎 的 工作 ， 但 是 实际 
应 用 中 并 不 都 是 这 样 。 例 如 ， 用 户 在 水 平 或 垂直 方向 上 拖 动 属性 滑 块 的 同时 ， 可 能 会 将 注意 力 
放 到 显示 区 域 的 其 他 部 分 ， 导 致 光标 移动 偏离 预期 的 设置 。 因 此 ， 在 拖 动 滑 块 的 过 程 中 不 应 该 
要 求 用 户 动作 的 高 度 精确 性 。 尽 管 光标 可 能 偏离 标准 位 置 ， 移 动 操作 还 是 应 该 被 解释 为 沿 着 滑 
块 方向 进行 的 。 下 面 是 设计 规范 有 利于 执行 的 另 一 个 例子 : 当 要 选取 的 部 分 在 直方 图 中 相距 很 
近 时 ， 需 要 对 光标 做 精确 定位 。 可 以 通过 以 下 办 法 克服 这 一 困难 : 当 连 续 的 鼠标 点 击 产生 在 同 
一 区 域 中 时 ， 将 其 视 作 对 相 邻 部 分 的 连续 选取 。 

在 很 多 连续 式 交互 的 例子 中 ， 用 户 竭力 想 为 可 修改 的 独立 参数 (如 价格 限制 ) 和 依赖 性 信 
息 〈 如 直方 图 中 的 绿色 总 面积 或 有 两 个 卧室 的 住房 数 等 ) 之 间 的 关系 建立 心理 映射 (mental 
mapping) 。 用 户 有 可 能 只 修改 一 个 参数 ， 这 将 导致 一 个 或 多 个 直方 图 产生 变化 ， 用 户 感知 、 
翻译 并 评估 这 些 变化 ， 以 判断 初始 的 意图 是 否 得 到 满足 。 用 户 也 可 能 进行 一 系列 快速 的 执行 动 
作 ， 如 逐步 放宽 价格 限制 ， 用 以 查看 其 对 直方 图 的 影响 。 前 面 提 到 过 ， 用 户 处 于 离散 信息 空间 
内 ， 该 空间 的 颗粒 度 和 探索 速度 使 得 空间 在 用 户 内 心 从 离散 空间 变 成 连续 空间 。 对 于 这 样 的 交 
互 ， 动 作 周 期 的 路 线 可 表示 为 如 图 5-11 或 如 图 5-12 所 示 的 和 时 间 有 关 的 函数 。 其 导致 的 解释 可 
能 是 “可 以 考虑 提高 预算 来 获得 房间 数 更 多 的 住房 "。 当 评估 阶段 得 到 满意 的 解释 时 ， 或 其 他 
原因 ， 交 互 的 执行 可 能 会 终止 。 





图 5-11 对 效果 的 动态 探索 所 涉及 的 动作 周期 的 各 个 阶段 





—| 上 -一 时 间 


大 约 50 毫 秒 


图 5-12 对 一 系列 交互 和 相应 的 视图 变化 进行 解释 ， 从 而 形成 心理 映射 
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我 们 还 要 对 上 述 周期 图 做 两 个 进一步 的 评论 。 第 一 ， 根 据 对 “变化 盲 视 ”(Rensink et al., 
2000; Rensink, 2002; Rensink URL) 和 能 获得 最 多 细节 的 视网膜 “中 央 凹 点 ”(Ware, 2004) 的 
了 解 , 我 们 认为 自动 地 假设 用 户 能 意识 到 显示 区 域内 的 所 有 变化 这 一 做 法 是 非常 危险 的 。 例如 ， 
对 价格 上 限 的 微调 可 能 会 导致 直方 图 的 剧烈 变化 ， 而 这 个 变化 可 能 超出 视网膜 中 央 凹 点 所 能 察 
觉 的 范围 。 应 该 通过 一 些 办 法 来 改善 这 种 情况 。 一 种 解决 办 法 是 ， 当 意外 的 、 可 能 会 被 忽略 的 
变化 出 现时 ， 和 背景 出 现 短暂 的 闪 动 。 第 二 种 方法 其 实在 前 面 的 讨论 中 已 经 隐 星 地 提 到 了 ， 我 们 
还 是 要 指出 (用户 ) 输入 和 相关 输出 的 同时 可 见 性 有 助 于 交互 映射 的 建立 。 


动态 触发 的 “醒目 ”信息 


使 用 连续 交互 的 用 户 很 快 就 会 意识 到 它 会 导致 一 种 同 “醒目 ”( 见 第 3 章 ) 类 似 且 同样 受 欢 
迎 的 效果 。 这 种 效果 和 第 3 章 中 介绍 的 对 象 和 属性 的 可 见 性 及 相关 性 等 概念 不 无 关系 。 下 面 我 
们 将 通过 两 个 例子 来 说 明 怎样 使 用 连续 交互 来 使 在 静态 显示 中 本 不 明显 的 对 象 和 属性 的 相关 性 
变 得 更 明显 。 

我 们 只 需要 查看 图 3-28 (在 这 里 重复 引用 为 图 5-13) 中 表示 敏感 度 的 圆圈 就 可 以 看 出 连续 
交互 式 是 如 何 对 对 象 相 关 性 做 解释 的 。 随 着 手动 或 自动 拖 动 右边 的 频率 范围 ， 部 件 上 圆 围 的 大 
小 会 发 生 相 应 的 改变 (Spence and Drew, 1971) 。 如 果 两 个 圆圈 同时 变 大 ， 对 象 相关 性 就 立即 
显示 出 来 了 。 在 多 数 情况 下 还 需要 进一步 的 探 察 才能 从 中 得 出 对 设计 有 用 的 启示 。 





图 5-13 部 件 上 的 圆圈 表示 该 部 件 对 电路 整体 性 能 的 影响 


第 二 个 例子 关注 属性 相关 性 ， 第 3 章 的 属性 浏览 器 是 个 很 好 的 示范 。 图 5-14 展 示 了 四 个 直 
GA. Elk A Pao 随机 选择 的 一 组 设计 中 某 点 的 压力 参数 S1 ~ S4 的 计算 结果 。 
此 ， 和 原始 的 属性 浏览 器 中 的 每 栋 住 房 类 似 ， 每 种 设计 对 应 于 一 个 直方 图 。 将 S4 的 上 限 从 最 
大 值 降 为 一 个 较 低 值 (图 5-15a) 将 显示 S4 和 S3 之 间 可 能 存在 的 相对 性 。 将 S4 的 限定 范围 在 上 
下 限 中 来 回 缓慢 移动 ( 见 图 5-15b 和 图 5-15c) 也 证 实 了 二 者 之 间 的 这 种 相对 性 。 不 需要 查看 直 
方 图 ， 可 以 在 每 个 选中 对 象 所 对 应 的 属性 滑 块 上 放 上 一 个 圆圈 (其 大 小 代表 平均 值 ， 图 5-16)， 
这 样 就 能 比较 容易 地 捕捉 到 平均 值 的 变化 。 


8 该 例 中 的 结构 指 灯泡 中 的 灯丝 。 它 的 设计 取决 于 设计 师 设 定 的 四 个 参数 值 。 在 结构 内 最 重要 的 是 四 个 压力 
参数 (Su er al., 1996), 
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CERES: ATERT RN 了 


_——E————E—— 


的 





图 5-15 当 S4 的 值 增 大 时 ，S3 的 值 相应 地 变 小 ， 显 示 了 两 者 间 可 能 的 相对 性 


Price RAGES E TE RE CSE FSR ET IN RI, 
MPG as aa SES SS 
HP st RST Oe I EE 
Cylinders Se SS SARS aT E 
Miles URA DA DEE IES PT CIEE AE PS 


图 5-16 黑色 圆圈 表示 满足 所 有 条 件 的 对 象 的 属性 平均 值 


以 上 两 个 例子 同 Teoh 及 Ma (2005) 的 评论 一 致 
sss 在 加 入 了 动画 的 可 视 化 中 ， 相 对 于 长 时 间 间 隔 的 两 个 框架 ， 相 邻 的 两 个 框架 更 能 清楚 
地 表示 对 象 / 维 [属性 ] 的 相关 性 。 
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5.3 渐进 式 交 互 


5.3.1 离散 信息 空间 

现 有 很 多 渐进 式 交 互 的 例子 ， 其 中 地 点 移动 产生 于 离散 信息 空间 中 。 图 5-2 (这 里 再 次 引 
用 为 图 5-17) 所 示 的 简单 例子 记录 了 一 对 寻找 晚上 娱乐 活动 的 夫妇 所 访问 过 的 网 页 : 为 了 看 看 
有 哪些 可 选项 ， 同 时 也 希望 能 找到 一 个 可 接受 的 选择 ， 他 们 搜索 了 一 系列 离散 的 地 点 。 其 中 没 
有 涉及 连续 交互 ， 虽 然 该 信息 空间 不 能 归 类 为 “迅速 反应 ”类 型 ， 但 是 任务 是 否 成 功 执行 明显 
取决 于 地 点 切换 的 迅速 性 (但 是 不 能 过 快 ， 见 5.6 节 )。 





图 5-17 寻找 娱乐 活动 的 过 程 中 涉及 的 渐进 式 交 互 


和 上 面 的 例子 不 同 ， 支 持 工程 设计 的 计算 机 辅助 设计 系统 提供 了 另 一 种 渐进 式 交 互 。 即 使 
是 很 简单 的 芯片 电路 系统 (如 运算 放大 器 ) ， 也 可 能 会 有 至 少 100 个 部 件 ， 而 设计 师 需 要 根据 
客户 设 定 的 至 少 200 个 属性 上 下 限 来 确定 各 个 部 件 的 属性 值 。 毫 无 疑问 ， 信 息 可 视 化 能 帮助 工 
程 设计 ， 但 太 大 的 视图 数量 可 能 导致 设计 师 不 能 事前 决定 有 用 的 数据 视图 。 但 是 我 们 还 是 应 该 
尽量 支持 设计 师 在 离散 信息 空间 中 视图 切换 ( 即 定位 ) 的 渐进 式 过 程 。 

以 上 两 个 例子 都 符合 Bertin (1981) 的 评论 : 

图 形 从 来 都 不 是 自我 选择 的 ， 它 是 决策 过 程 中 的 某 个 时 刻 选 择 的 。 

万 维 网 本 质 上 是 一 个 巨大 的 、 无 结构 的 离散 信息 空间 ， 在 万 维 网 上 通过 浏览 系列 网 页 来 解 
决 问题 的 用 户 会 对 这 个 评论 产生 共鸣 。 

动作 的 不 同 阶段 

我 们 可 以 根据 Norman 动 作 周 期 来 分 析 渐 进 式 交互 存在 的 问题 。 对 于 连续 式 交 互 ， 为 数据 
建立 心理 模型 的 目标 触发 了 探 察 数据 视图 的 离散 变化 的 意图 。 第 二 个 步骤 是 形成 行动 计划 ， 它 
为 交互 设计 师 带 来 了 很 多 的 挑战 。 对 于 渐进 式 交 互 ， 用 户 必须 确定 信息 空间 中 最 有 用 的 单个 动 
作 。 针 对 诸如 “(在 离散 信息 空间 中 ) 我 应 该 从 当前 位 置 走向 哪里 ? ”或 “我 怎样 到 达 那 里 ? ” 
等 问题 ， 我 们 认为 用 户 必 须 在 离散 信息 空间 中 进行 地 点 定位 。 决 定 和 执行 必需 的 动作 将 导致 视 
图 的 离散 变化 ， 然 后 用 户 会 对 变化 做 出 感知 和 解释 。 第 3 章 中 介绍 过 的 数据 描述 的 相关 概念 和 
技术 以 及 数据 表示 的 时 间 和 空间 局 限 性 都 和 解释 支持 相关 。 
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5.3.2 定位 


要 想 支持 定位 ， 我 们 首先 应 了 解 用 户 关心 的 问题 。 很 多 时 候 需 要 解决 的 问题 没有 初始 的 精 
确定 义 ， 用 户 在 未 知 的、 无 结构 的 、 巨 大 的 数字 信息 空间 里 所 关心 的 问题 和 在 未 知 的、 无 结构 
的 、 巨 大 的 物理 空间 内 的 是 一 致 的 。 虽 然 Wittenburg (1997) 曾 警告 “电脑 空间 中 的 定位 和 物 
理 空 间 中 的 定位 是 不 一 样 的 "， 但 用 户 会 问 的 问题 是 一 样 的 : 

我 现在 在 哪里 ? 

我 能 去 哪里 ? 

我 怎样 到 达 那 里 ? 

周围 有 什么 ? . 

我 到 哪 去 是 最 有 用 的 ? 

当 考 虑 如 何 回答 这 些 问 题 时 ， 我 们 要 认识 到 信息 空间 中 的 活动 并 不 总 是 “向 前 ”朝向 未 访 

(50) 间 地 点 的 ， 也 可 以 “向 后 ”回溯 已 经 访问 过 的 地 点 。 因 此 ， 用 户 还 会 经 常 问 以 下 问题 : 

我 到 过 哪里 ? (我 想 回 到 那里 。) 

我 们 把 定位 定义 为 离散 信息 空间 内 的 活动 ， 我 们 需要 研究 和 定位 相关 的 概念 以 及 如 何 帮助 
用 户 进 行 定 位 (Jul and Furnas, 1997; Woods and Watts, 1997) 。 我 们 必须 首先 认识 到 用 户 在 信 
息 空间 内 定位 的 原因 。 用 户 可 能 有 单个 明确 的 已 知 地 点 ， 例 如 关于 Tasmanian Devil 的 交配 鸣叫 
声 的 信息 。 他 们 也 可 能 会 使 用 在 线 商店 购买 母亲 节 礼 物 ， 在 做 出 决定 前 花费 大 量 时 间 来 了 解 在 
售 商品 的 信息 。 电 子 设计 师 或 金融 顾问 可 能 会 在 一 系列 活动 中 做 出 一 些 决定 ， 从 而 确定 最 终 产 
品 。 所 有 这 些 例子 都 涉及 定位 问题 ， 即 信息 空间 中 的 一 系列 移动 。 如 果 目 标 是 明确 的 、 已 知 的 
且 唯 一 的 ， 我 们 可 以 使 用 寻 路 (wayfinding) 这 个 术语 。 相 对 的 ， 探 索 (exploration) 一 词 通 
常 指 用 户 为 了 解 信息 空间 (以 增强 对 该 空间 的 心理 模型 ) 所 采取 的 行动 。 追 击 (pursuit) 一 词 
指 为 找到 特定 目标 而 采取 的 直接 行动 ， 这 些 行动 一 般 和 信息 空间 的 累积 心理 模型 关联 较 少 。 

任何 在 万 维 网 上 搜寻 过 信息 或 使 用 过 设计 很 差 的 信息 系统 的 用 户 都 能 体会 到 为 以 上 6 个 问 
题 提 供 答案 的 重要 性 。 本 节 中 将 会 依次 回答 这 些 问 题 ， 我 们 首先 从 相关 性 较 高 的 问题 2 和 问题 3 
着 手 。 


5.3.3 敏感 度 


以 下 是 一 个 物理 空间 内 定位 的 例子 (Lewis, 1994): 一 位 波利尼西亚 的 航海 家 在 海上 航行 
中 接近 了 一 座 小 岛 ， 虽 然 这 座 岛 在 海平 面 上 是 不 可 见 的 ， 但 他 注意 到 了 岛 的 上 方 村 着 一 片 云 
(图 5-18) 。 这 片 云 可 以 作为 定位 线索 ， 它 提示 了 那里 有 什么 以 及 如 何 到 达 那 里 。 我 们 虽然 关心 
的 是 信息 空间 而 非 物理 空间 ， 但 我 们 依然 在 寻找 回答 下 列 问题 的 线索 : 
我 能 去 哪里 ? 
我 怎样 到 达 那 里 ? 
现在 我 们 关注 的 是 语义 上 下 文 ， 而 不 是 物理 关系 (Dourish and Chalmers, 1994) 。 
这 里 可 以 使 用 敏感 度 (sensitivity) 的 概念 。 考 虑 到 上 述 问题 和 信息 空间 中 的 活动 以 及 实 
[151] 施 活动 所 需 的 交互 直接 相关 ， 我 们 将 敏感 度 定义 如 下 : 
敏感 度 : 信息 空间 中 的 移动 以 及 实现 该 移动 所 需 的 交互 。 
为 了 表达 方便 ， 我 们 将 敏感 度 S 定 义 为 ， 
S=SM, SI 
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其 中 ，SM 表 示 信 息 空间 中 的 移动 ，SI 表 示 实 施 该 移动 所 需 的 交互 。 下 面 我 们 通过 两 个 例子 分 
别针 对 物理 和 信息 空间 来 讨论 敏感 度 概念 及 其 两 个 组 成 部 分 。 





图 5-18 小 岛 在 水 平面 上 不 可 见 ， 但 它 上 方 的 云 提供 了 定位 线索 


图 5-19 展 示 了 一 道 可 供 人 通过 的 门 。 门 上 的 标签 可 以 看 做 是 SM， 因 为 经 过 解释 后 人 们 明 
白 穿 过 门 就 可 以 喝 到 咖啡 。 实 施 该 活动 ( 穿 过 该 门 ) 所 需 的 交互 (SI) 由 门 的 外 观 决定 : 门 不 
能 拉 开 ， 平 整 的 门板 明白 地 告诉 8 我 们 推 开 门 就 可 以 通过 。SI 实 际 上 是 我 们 所 知 的 预示 性 
(affordance, Gibson, 1977; Norman, 2004) SS。 任 何 物理 空间 的 设计 师 都 明白 保持 用 户 感知 到 [53 
的 预示 性 和 实际 预示 性 一 致 的 重要 性 ， 旅 店内 的 淋浴 控制 器 就 是 一 个 很 好 的 例子 。 





图 5-19 标签 “咖啡 ”和 平整 的 门板 提供 了 定位 线索 ， 告 诉 了 用 户 能 去 哪里 (咖啡 ) 以 及 怎样 去 
到 那里 ( 推 门 ) 


图 5-20 显 示 了 标题 为 “假期 去 哪里 ”的 网 页 的 一 部 分 内 容 。 页 面 上 有 五 个 加 有 标签 (英国 、 


O 在 某 些 国家 可 能 不 是 这 样 的 。 门 的 两 面 都 有 把 手 ， 并 且 各 有 一 个 写 着 “ 推 ” 或 “ 拉 ” 的 标签 。 在 没有 指示 、 
的 情况 下 ， 可 能 会 用 到 复杂 的 策略 才能 明白 预示 性 。 

O ”预示 性 的 概念 首先 由 Gibson (1977) 提出 ， 它 指 人 类 和 “世界 ”之 间 的 交互 。 我 们 可 以 认为 图 5$-19 中 的 门 
的 预示 性 是 通过 “ 推 ” 将 门 打开 。 这 也 是 门 的 实际 预示 性 。 很 明显 ， 为 了 使 人 们 能 轻松 通过 ， 用 户 襄 知 到 
的 预示 性 应 该 和 实际 预示 性 一 致 。Norman (2004) 也 对 预示 性 进行 了 讨论 。 
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欧洲 等 ) 并 区 别 于 背景 的 区 域 。 可 以 根据 不 同 的 假期 类 型 通过 它们 移动 (SM) 到 其 他 页 面 。 
对 应 区 域内 的 鼠标 点 击 (SI) 可 以 实现 到 不 同 页 面 的 移动 。 因 此 ， 这 些 线索 同时 包含 了 SM 和 
SI 信息 。 有 些 例子 中 的 线索 是 容易 理解 的 , 但 在 设计 较 差 的 例子 中 线索 的 识别 和 解释 是 困难 的 。 
线索 理解 的 难 易 度 取决 于 交互 设计 师 的 视觉 设计 能 力 (Nielsen and Tahir, 2002; Wildbur and 
Burke, 1998) 。 在 某 些 情 况 下 ， 解 释 的 困难 度 可 以 通过 提供 鼠标 悬 停 效果 加 以 解决 。 
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图 5-20 某 网 页 的 部 分 内 容 。 每 个 标签 及 其 周围 的 黑色 区 域 表 明 根 据 假期 类 型 在 区 域 上 点 击 鼠 标 
(SI) 可 以 切换 到 对 应 页 面 (SM) 


第 3 章 中 介绍 过 的 属性 浏览 器 显示 了 对 敏感 度 信息 的 编码 方法 。 基 于 住房 的 三 个 属性 ， 
图 5-21 中 的 黑色 表示 仅 不 满足 6 个 属性 限制 中 的 1 个 的 住房 ， 灰 色 对 应 仅 不 满足 2 个 限制 的 住房 ， 
以 此 类 推 。 我 们 看 到 在 这 样 一 个 数量 庞大 的 集合 中 ， 交 互 设 计 师 并 未 对 每 栋 住 房 使 用 一 个 单独 
的 线索 来 表示 活动 (SM) 。 考 虑 到 用 户 通常 会 通过 缩小 考察 范围 来 将 精力 集中 到 少数 住房 上 ， 
而 且 改变 属性 限制 可 能 带 来 潜在 变化 ， 因 此 该 系统 用 黑色 表示 仅 不 满足 1 个 属性 限制 的 住房 。 
所 有 的 SM 都 可 以 使 用 类 似 的 编码 方法 。 黑 色 编 码 的 优势 在 于 即使 条 件 苛刻 导致 没有 绿色 住房 
出 现 ， 在 限定 范围 外 围 的 黑色 住房 还 是 可 以 提供 有 用 的 线索 : 要 放松 限制 绿色 住房 才能 出 现 。 
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限制 定位 机 制 (Ahlberg, 1996) 是 对 敏感 度 做 聚合 的 一 种 非常 简单 的 编码 方式 (图 5-22)。 
该 技术 最 早出 现在 动态 查询 (dynamic query) 界面 中 ( 见 图 $-22)， 现 在 用 于 SpotfirerM 的 可 视 
化 工具 (Spotfire) 中 。 滑 块 的 白色 部 分 是 对 所 表示 信息 没有 影响 的 上 下 限 的 边界 值 。 当 在 灰 
色 区 域内 改变 限制 值 时 会 引起 信息 空间 的 移动 。 该 编码 技术 可 以 有 效 地 回答 “如 果 …… 会 怎 
样 ? ”( 简 单 地 说 ,“ 如 果 …… 怎 样 ") 的 问题 。 该 编码 机 制 起 到 了 很 好 的 启示 作用 ， 对 于 有 些 
“如 果 …… 怎 样 ”的 问题 ， 答 案 可 能 是 “没有 变化 ”。 
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房间 数 
图 5-22 在 限制 定位 工具 中 ， 颜 色 编 码 表示 选择 是 否 会 产生 效果 。 当 前 下 限 位 于 不 会 产生 效果 的 
白色 区 域内 。 如 果 限 制 条 件 进入 灰色 区 域 则 会 导致 变化 效果 


敏感 度 信息 的 价值 可 以 在 以 下 例子 中 得 以 体现 : 相关 信息 立即 可 见 ， 但 是 不 可 使 用 。 
图 5-23 显 示 的 是 利用 动态 查询 界面 (Williamson and Shneiderman, 1992; Ahlberg, 1996) 进行 
住房 查询 的 系统 。 该 系统 用 于 帮助 用 户 进行 住房 购买 。 地 图 中 的 点 表示 满足 用 户 设 定 属性 条 件 
的 住房 。 这 里 最 大 的 缺点 是 当 没 有 满足 要 求 的 住房 时 ， 界 面 不 能 提供 敏感 度 信 息 ， 这 导致 用 户 
不 知道 如 何 改变 属性 值 来 使 地 图 中 出 现 可 能 会 被 接受 的 住房 。 相 应 的 ， 只 能 在 依次 调节 了 每 个 
属性 后 才能 形成 对 满足 条 件 的 住房 的 心理 模型 。 尤 其 当 属 性 多 于 10 个 时 , 该 操作 将 是 很 耗 时 的 。 
特别 当 找到 满意 住房 所 花费 的 “ 非 直 接 ” 探 索 多 于 直接 操作 时 ， 该 方法 的 缺点 显得 尤为 突出 。 
动态 查询 界面 过 滤 (并 且 隐 藏 ) 信息 ， 而 属性 浏览 器 根据 用 户 兴趣 对 所 有 数据 进行 编码 。 如 
图 5-24 所 示 ， 可 以 容易 地 在 动态 查询 界面 中 引入 “黑色 住房 ” 式 的 敏感 度 线索 ， 它 支持 “ 先 看 
FÆ” (see and go) 策略 。 如 果 没 有 敏感 度 线索 ， 用 户 只 能 执行 麻烦 的 “ 先 走 再 看 ”(go and 
see) 策略 。 
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图 5-23 动态 查询 界面 。 地 图 上 的 点 代表 满足 用 户 设 定 的 属性 限制 条 件 的 住房 


仅 不 满足 价格 条 件 的 三 栋 住房 


下 限 上 限 


Ne Na 价格 


图 5-24 对 动态 查询 界面 的 修改 。 灰 色 线条 表示 仅 不 满足 一 个 条 件 的 住房 。 和 只 能 通过 手动 改变 
限制 条 件 来 显示 敏感 度 信息 相 比 ， 该 方法 更 明确 地 传递 了 敏感 度 线索 


第 2 章 中 介绍 过 的 信息 可 视 化 的 商业 应 用 EZChooser (Wittenburg et al., 2011) 可 以 很 好 地 
反映 敏感 度 的 作用 。 该 系统 用 于 支持 在 线 销售 ， 用 户 可 以 根据 属性 值 从 集合 中 选择 某 个 对 象 。 
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图 5-25 显 示 的 是 在 第 2 章 中 介绍 过 的 关于 汽车 销售 的 实例 。 边 界 图 标 代表 仅 不 满足 一 个 要 求 的 
汽车 。6.2 节 将 详细 介绍 EZChooser 的 开发 过 程 。 
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图 5-25 在 EZChooser 中 ， 图 标 代表 仅 不 满足 一 个 要 求 的 汽车 。 选 中 图 标 下 方 的 属性 值 可 以 立即 将 
该 车 纳入 满足 所 有 条 件 的 范畴 


在 有 些 情况 下 ， 敏 感度 信息 虽然 不 能 直接 显示 ， 但 可 以 通过 计算 得 到 ， 可 以 参见 参考 文献 
(Andrienko and Andrienko, 2003; Spence, 2004) 。 在 一 些 物理 系统 中 可 以 通过 强大 的 算法 来 进 
行 敏 感度 计算 (Brayton and Spence, 1980), 

社会 定位 (social navigation) 是 激发 用 户 兴 趣 的 另 一 种 方式 (Munro et al., 1999; Hook et 
al., 2003) 。 线 索 不 是 由 交互 设计 师 提 供 的 ， 而 是 通过 收集 用 户 动作 产生 的 ， 它 会 影响 用 户 对 
目的 地 的 选择 。“ 购 买 了 这 本 书 的 顾客 同时 也 购买 了 …… ”是 常见 出 现 于 “推荐 系统 ” 
(recommender system) 中 的 线索 。 这 里 的 线索 实质 上 叫 “ 推 荐 产生 的 敏感 度 ”(recommender- 
generated sensitivity) 更 为 贴切 。 


5.3.4 残留 物 


我 们 对 敏感 度 的 定义 建立 在 信息 空间 内 页 面 切换 的 单个 移动 这 一 前 提 下 。 通 常用 户 在 问题 
得 到 解决 前 会 访问 一 系列 页 面 。 在 这 个 过 程 中 ， 用 户 会 不 断 地 问 “周围 有 什么 ? “， 因 此 ,， 通 
过 线索 对 活动 进行 描述 (SM) 可 以 额外 地 提供 当前 单个 移动 的 周边 信息 ， 从 而 有 助 于 定位 过 
程 的 进行 。Furnas (1997) 正 是 基于 这 个 原因 提出 了 残留 物 的 概念 。 我 们 将 其 定义 如 下 : 

残留 物 (residue): 对 SM 编码 的 远 端 内 容 的 提示 。 

这 里 的 “ 远 端 ” 指 从 当前 位 置 采取 多 于 一 步 的 移动 才能 到 达 的 内 容 。 残 留 物 对 用 户 是 有 用 
的 ， 但 交互 设计 师 一 定 要 记 住 它 有 一 个 额外 的 前 提 条 件 : 设计 出 的 线索 必须 能 够 使 用 户 正确 识 
别 信息 空间 中 单个 移动 的 后 果 ， 而 且 要 提示 后 续 活 动能 到 达 的 内 容 。 因 此 ， 当 敏感 度 信息 扩展 

到 多 步 移动 时 ， 残 留 物 不 仅 表示 远 端 内 容 ， 还 可 以 作为 敏感 度 编码 的 一 般 形 式 。 由 于 通常 倾向 

于 将 “ 远 端 内 容 ” 理 解 为 未 访问 过 的 内 容 ， 因 此 通过 返回 键 等 方法 允许 对 已 访问 内 容 的 重 访问 
是 很 重要 的 。 支 持 定位 的 设计 应 该 在 保证 残留 物 的 同时 允许 访问 和 重 访问 。 

我 们 可 以 通过 一 个 层次 式 的 、 基 于 菜单 的 动物 信息 系统 来 加 深 对 残留 物 和 敏感 度 的 理解 。 
图 5-26 显 示 了 该 菜单 系统 的 最 高 两 层 内 容 。 动 物种 类 按 层次 排列 以 方便 对 某 种 特定 动物 的 查找 。 
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在 菜单 系统 的 顶层， 哺乳 动物 是 四 个 可 选 选项 之 一 ， 鼠 标点 击 该 选项 可 以 进入 下 一 层 和 各 种 哺 
乳 动物 有 关 的 菜单 。 因 此 ， 菜 单 选项 “哺乳 动物 ”同时 包含 了 SM 和 SI 信息 。 作 为 残留 物 ， 它 
也 表明 了 所 有 哺乳 动物 都 可 以 在 对 应 的 第 二 级 及 以 下 菜单 内 找到 。 例 如 ， 位 于 “ 猎 ” 菜单 下 的 
阿 比 西 尼 亚 猫 在 顶级 菜单 中 的 “哺乳 动物 ”一 项 中 有 残留 物 。 







对 哺乳 动物 的 SM 和 
SI 的 编码 


昆虫 类 


图 5-26 层次 结构 的 、 基 于 菜单 的 动物 信息 系统 的 最 高 两 层 内容 


正 是 由 于 采用 了 动物 信息 空间 的 层次 结构 ,“ 哺 乳 动物 ”标签 才能 同时 表示 残留 物 和 敏感 
度 信息 。 而 在 万 维 网 等 非 结 构 化 的 信息 空间 中 ， 在 某 个 页 面 中 加 入 阿 比 西 尼 亚 猫 的 信息 并 不 会 
为 很 多 其 他 网 页 (如 果 存 在 的 话 ) 提供 残留 物 。 即 使 是 使 用 层次 化 的 菜单 结构 ， 残 留 物 的 设计 
也 可 能 不 是 直接 的 : 例如 ， 用 户 的 知识 不 可 能 很 全 面 ， 这 可 能 导致 在 寻找 鲸鱼 的 过 程 中 错误 地 
选择 “ 鱼 类 "。 

如 果 读 者 对 定位 设计 中 残留 物 的 重要 性 还 存 有 疑问 的 话 ，Snowberry 和 她 的 同事 的 工作 成 
果 (1983, 1985) 提供 了 最 具 说 服 力 的 证 明 。Snowberry 等 (1983) 研究 了 层次 结构 的 菜单 系 
统 的 定位 状况 。 实 验 参 与 者 被 要 求 在 包含 64 个 英文 常用 词汇 的 层次 结构 数据 库 中 找到 一 个 目标 
词汇 。 考 虑 到 64 对 应 于 8*、4: 以 及 25， 研 究 者 分 别 对 宽 而 浅 以 及 罕 而 深 的 菜单 结构 做 了 实验 。 
图 5-27 显 示 了 在 2 菜单 中 找到 目标 词汇 “ 枪 鱼 ”所 需 经 过 的 直接 路 径 (不 含 回溯 路 径 )。 

实验 中 首先 向 每 位 参与 者 展示 一 个 目标 词汇 ， 然 后 要 求 他 们 在 不 回 滴 的 前 提 下 做 出 正确 的 
选择 直至 找到 目标 词汇 。 图 5-28 显 示 了 在 2 菜单 结构 的 各 层 上 出 现 的 错误 ( 即 不 正确 的 选择 ) 
率 。 毫 无意 外， 多 数 错误 发 生 在 最 顶端 两 层 ， 这 凸显 了 为 相隔 一 定 距离 的 目标 提供 残留 物 的 困 
难度 。 在 另外 一 个 独立 实验 中 ， 研 究 者 分 别 探索 了 宽 而 浅 以 及 窄 而 深 的 菜单 结构 。 图 5-29 的 结 
果 显 示 错 误 率 深 受 菜单 结构 的 影响 (p<0.0001) SS， 从 而 清晰 地 反映 了 宽 而 浅 的 菜单 结构 可 以 
在 较 高 层次 上 为 目标 词汇 提供 很 好 的 残留 物 。Snowberry 等 人 以 外 的 关于 层次 结构 的 其 他 研究 
可 以 参见 参考 文献 (Norman and Chin, 1988; Norman, 1991), 

Snowberry 等 人 进一步 研究 了 帮助 字段 (help field) 的 作用 (Snowberry et al., 1985), 
图 5-30 是 一 个 帮助 字段 的 例子 。 在 每 个 可 选项 下 方 均 显示 了 一 些 字段 ， 它 们 代表 着 选择 该 选项 
后 在 下 一 级 菜单 中 将 会 出 现 的 选项 。 这 些 字段 可 以 起 到 对 上 级 选项 的 解释 作用 ， 从 而 提供 了 残 
留 物 。 这 个 例子 需要 研究 的 中 心 问题 是 各 选项 和 相关 帮助 字段 是 否 有 助 于 形成 残留 物 。 除 提供 
敏感 度 线索 外 ， 鼠 标 悬 停 效 果 有 时 也 可 提供 额外 的 残留 物 。 

研究 发 现 ， 在 2“ 菜 单 结构 中 使 用 帮助 字段 只 带 来 了 8 多 一 10% 的 错误 率 ， 而 没有 使 用 帮助 字 


O ”p=0.0001 表 示 所 得 结论 为 偶然 的 概率 是 1/10 000, 
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段 的 错误 率 高 达 22% ~ 28% ， 从 统计 学 角度 上 看 ， 这 个 差异 是 显著 的 〈P<0.001)。 这 说 明 帮 助 
字段 在 各 层 上 均 能 有 效 地 提供 残留 物 。 





图 5-27 在 2 菜单 中 找到 目标 词汇 “ 枪 鱼 ” 所 需 经 过 的 路 径 


40 
30 
请 
a 20 
i 
% 
10 
1 2 3 4 5 6 
菜单 层次 
图 5-28 在 空 而 深 的 2 菜单 结构 中 查找 低层 次 目标 词汇 的 错误 率 
100 
90 
80 
Ht 
Z 70 
€ 
H 60 
50 
tO 
2 4 8 64 
每 个 层次 上 显示 的 选项 数 


图 5-29 同 菜单 结构 相关 的 查找 正确 率 
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图 5-30 引入 帮 助 字段 的 菜单 系统 ， 来 自 下 一 层次 的 帮助 字段 有 助 于 提高 对 菜单 选项 的 解释 的 
正确 率 


5.3.5 气味 


目前 为 止 ， 我 们 已 经 讨论 过 了 设计 线索 的 必要 性 。 加 入 了 敏感 度 信息 和 远 端 内 容 的 线索 可 
以 提高 正确 解释 的 概率 。 对 线索 进行 解释 的 原因 在 于 ， 如 果 用 户 从 可 执行 的 移动 中 选择 了 一 个 
移动 ， 紧 跟 解释 的 下 一 步 操 作 就 是 评估 。 因 此 ， 用 户 必须 评价 每 项 可 能 移动 SM 的 益处 。 这 里 
需要 回答 的 问题 不 仅 是 : 

我 能 去 哪里 ? 
更 重要 的 是 : 

我 到 哪 去 是 最 有 用 的 ? 

基于 上 述 考 虑 ， 研 究 者 引入 了 气味 (scent) 的 概念 (Pirolli and Card, 1999) 。 气 味 的 定义 
如 下 : 

气味 : 在 对 一 个 或 多 个 线索 的 解释 评估 基础 上 ， 感 知 到 的 信息 空间 中 某 移动 的 益处 。 

“气味 ”一 词 最 早 来 源 于 生物 学 领域 的 培养 理论 (Stephens and Krebs, 1986) ， 现 扩展 到 信 
息 搜索 领域 (Pirolli and Card, 1999) 。“ 益 处 ”一 词 隐 上 地 提示 了 信息 空间 内 进行 某 移动 所 付 
出 的 “代价 ”。 

我 们 应 该 充分 认识 到 气味 的 评估 会 决定 在 信息 空间 内 下 一 步 该 去 的 目的 地 ， 这 是 一 个 高 阶 
认 知 过 程 ( 见 图 2-17)。 它 可 以 为 用 户 对 信息 空间 的 现 有 (通常 是 多 变 的 ) 内 部 模型 以 及 (BK 
然 经 常 是 多 变 的 ) 相应 策略 的 调整 提供 参考 。 用 户 可 以 通过 探 察 来 增强 对 信息 空间 的 心理 模型 ， 
也 可 以 重 定义 目标 或 尽 可 能 直接 地 朝 着 暂时 或 最 终 目标 移动 。 很 多 情况 下 用 户 会 遇 到 这 两 者 的 
组 合 。 因 此 ， 气 味 涉及 建立 模型 和 形成 策略 等 具有 较 高 复杂 度 和 认 知 度 的 活动 。 虽 然 交 互 设计 
师 可 能 已 经 次 刻 认 识 到 了 这 些 高 阶 认 知 过 程 的 重要 性 ， 但 是 对 他 们 而 言 最 基本 的 还 是 一 般 性 指 
导 原 则 。 现 有 网 页 设计 领域 的 研究 (e.g. Chi et al., 2001) 试图 利用 气味 这 一 概念 来 对 用 户 目 
标 、 交 互 行为 和 可 见 线 索 进行 数学 建 模 。 图 5-31 显 示 了 敏感 度 、 残 留 物 和 气味 之 间 的 关系 。 

虽然 气味 评估 涉及 复杂 的 认 知 过 程 ,但 是 可 以 通过 一 些 简单 的 编码 来 实现 有 效 的 气味 评估 。 
Model Maker (Smith et al., 2001) 是 气味 评估 的 有 效 编码 支持 的 一 个 很 好 的 示例 。 它 是 专门 为 
非 统计 学 专家 设计 的 一 个 工具 ， 用 于 给 定点 的 多 项 式 拟 合 。 图 5-32 显 示 了 6 个 点 及 其 对 应 的 X 和 
7Y 值 。 由 于 对 这 六 个 点 的 拟 合 可 能 很 复杂 ， 并 且 需 要 其 他 X 值 所 对 应 的 Y 值 ， 因 此 需要 为 X 和 7 的 
关系 建立 一 个 数学 模型 。 如 图 5-33 所 示 ， 因 变量 7 通常 是 和 很 多 自 变 量 相关 的 函数 。 
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残留 物 (= 对 远 
端 内 容 的 编码 线 
索 ) 敏感 度 线索 





图 5-31 敏感 度 、 残 留 物 和 气味 之 间 的 关系 


Y 


X 


图 5-32 6 个 不 同 的 X 值 所 对 应 的 ? 值 。 需 要 为 X 和 Y 的 关系 建立 一 个 具有 一 定 精 度 的 数学 模型 


Y = atbXtcXytdXyteX XtfX Xy+ BX 5X +hX +X +kXy 


图 5-33 因 变 量 和 自 变量 间 的 一 种 典型 关系 


现 有 软件 (如 GENSTAT 工 具 集 ) 通过 计算 相关 系数 值 (如 图 5-33 中 的 4、b、c 等 ) 为 原始 
点 找到 最 优 匹配 。 然 而 ， 模 型 所 涉及 的 各 项 数 需 由 该 领域 的 专家 来 选择 。 根 据 个 人 理解 ， 专 家 
也 许 知道 项 数 X,X, 可 能 不 相关 ，X,Xs 可 能 相关 。Model Maker 可 以 帮助 用 户 决定 最 终 引 入 模型 
的 项 数 ( 见 图 5-34)。 多 项 式 的 每 个 可 能 的 项 数 对 应 于 一 个 小 盒子 ， 图 5-24 对 应 一 个 有 4 个 自 变 
量 的 最 高 为 三 次 的 多 项 式 。 圆 的 大 小 表示 各 项 数 对 拟 合 过 程 的 贡献 。 黑 色 圆 圈 表 示 对 应 项 已 纳 
入 模型 ， 白 色 反之 。 引 入 这 些 圆圈 的 目的 在 于 通过 观察 增加 或 移 除 各 项 带 来 的 变化 来 实现 对 气 
味 的 评估 。 盒 子 也 传达 了 SM 和 SI 信息 : 在 盒子 上 单 击 可 以 将 对 应 的 项 加 入 模型 或 移 除 。 

二 次 项 
Ry 3 HG’. A 


"e -opa 
* E 
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图 5-34 Model Maker 界 面 
在 图 5-35 中 ， 选 中 菜单 项 的 大 小 表示 对 应 选项 在 数据 集中 所 占 的 比例 。 另 外 ， 颜 色 编码 可 
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以 代表 每 个 选项 的 流行 度 。 虽 然 这 是 一 个 很 简单 的 例子 ， 但 它 有 可 能 不 会 被 直接 执行 ， 这 是 因 
为 用 户 总 会 在 对 所 有 可 能 的 SM 以 及 相应 会 带 来 的 益处 做 解释 后 才 做 出 活动 决策 (Nielsen， 
2000)。 





图 5-35 支持 气味 评估 的 编码 


属性 浏览 器 是 支持 气味 评估 的 第 三 个 例子 。 黑 色 房屋 离 不 满足 的 单个 限制 条 件 的 距离 可 能 
会 导致 用 户 对 限制 条 件 的 调整 。 


5.3.6 我 现在 在 哪里 


可 能 读者 会 觉得 奇怪 ， 为 什么 我 们 最 后 才 来 讨论 “我 现在 在 (信息 空间 中 的 ) 哪里 ? ”这 
个 问题 。 在 有 合理 线索 设计 的 前 提 下 ， 我 们 已 经 回答 了 以 下 问题 : 

我 能 去 哪里 ? 

我 怎样 到 达 那 里 ? 

周围 有 什么 ? 

我 到 哪 去 是 最 有 用 的 ? 

我 们 能 做 的 不 只 是 让 用 户 了 解 信息 空间 的 本 质 以 及 他 们 当前 所 在 的 位 置 。 

面包 居 (breadcrumb) 一 词 很 适用 于 这 个 语 境 ， 它 来 源 于 一 个 关于 Hansel 和 Gretel 的 故事 : 
在 穿越 森林 的 途中 , MNES LAP Re RAD ERE (由 于 他 们 没有 做 回 济 ， 
这 些 面包 悄 的 功能 没有 得 到 使 用 )。 面 包 必 代表 着 历史 。 与 此 相关 的 一 个 问题 是 : 

我 去 过 哪里 (因为 我 想 回去 ) ? 

路 径 和 位 置 是 两 种 常见 的 历史 信息 。 

1. 路 径 历史 信息 

路 径 历 史 信 息 记 录 了 用 户 在 信息 空间 内 最 近 经 过 的 路 径 。 图 5-36 显 示 了 该 路 径 及 用 户 的 当 
前 位 置 。 正 如 我 们 已 经 指出 的 ， 回 漳 是 信息 空间 中 的 常见 活动 ， 因 此 不 仅 应 该 对 最 近 经 过 的 地 
点 编码 ， 还 应 该 用 同样 方法 对 SI 编码 ， 这 样 才能 通过 交互 较为 容易 地 实现 选择 性 回溯 这 一 信息 
空间 内 的 常见 活动 。 例 如 ， 万 维 网 上 60% 的 活动 都 是 重 访问 已 经 访问 过 的 (经 常 是 最 近 访 问 过 
的 ) 页 面 (Tauscher and Greenberg, 1997)。 用 户 访问 的 下 一 个 页 面 是 6 个 已 访问 页 面 其 中 之 一 的 
概率 是 39%。 正 如 Tauscher 和 Greenberg 所 评论 的 ,“ 回 溯 控 制 对 下 一 访问 页 面 的 预测 非常 有 用 "”。 
因此 ， 在 支持 定位 的 交互 设计 中 ， 敏 感度 和 残留 物 的 设计 将 受益 于 基于 历史 信息 的 重 访问 。 

显示 在 回 退 按钮 〈 它 是 应 用 最 广泛 的 用 户 界面 部 件 (Cookbur et al., 2002)) 旁 的 最 近 访 
问 过 的 URL 是 支持 选择 性 回 退 的 一 个 简单 示例 ( 见 图 5-37)。 尽 管用 户 对 已 访问 过 的 URL 的 内 
部 模型 可 能 比较 粗糙 ， 但 他 们 仍然 可 以 识别 出 这 些 页 面 的 外 观 (Kaasten et al., 2002) 。 因 此 ， 
有 下 拉 菜 单 特别 是 可 放大 缩 略 图 的 图 形 历史 信息 (图 5-38) 可 以 有 效 地 支持 重 访问 。 支 持 重 访 
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间 的 设计 涉及 信息 可 视 化 ， 是 个 具有 挑战 性 的 任务 。 


用 户 路 径 
当前 位 置 





图 5-36 对 历史 信息 和 当前 位 置 的 描述 






http://news.bbc.co.uk 
http://news.bbc.co.uk/1/hi/education/default.stm 
http://news.bbc.co.uk/1/hi/england/south_counties/4932646. 
http://news.bbc.co.uk/1/hi/england/south_counties/4892000. 






图 5-37 最 近 访 问 过 的 URL 列 表 





图 5-38 最 近 访 问 过 的 页 面 的 缩 略 图 。 该 集合 可 以 提供 很 好 的 定位 线索 


“路 径 历史 信息 ”从 一 定 程度 上 告诉 用 户 “ 他 们 在 信息 空间 中 的 当前 位 置 *， 并 且 为 该 空间 
的 本 地 细节 信息 提供 了 部 分 视图 。 当 前 位 置 通常 和 外 部 链接 相连 (如 图 5-39 所 示 ) ， 可 以 帮助 


用 户 明 确 在 空间 中 的 位 置 。 
用 户 当前 位 置 
路 径 


外 部 链接 
图 5-39 在 离散 信息 空间 中 从 当前 位 置 能 达到 的 路 径 
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2. 位 置 历史 信息 

一 日 用 户 处 于 一 个 网 站 内 部 〈 例 如 组 织 或 公司 网 站 ) ， 他 们 不 仅 应 该 看 到 该 空间 的 结构 ， 
还 应 该 能 在 该 结构 中 较为 自由 地 活动 。 因 此 ， 如 图 5-40 中 的 红色 编码 所 示 ， 网 站 结构 可 通过 对 
结构 中 可 能 位 置 的 编码 得 以 体现 。 为 了 方便 访问 , 可 以 为 这 些 描述 提供 交互 (例如 可 对 SI 编码 )。 
图 5-40 中 蓝 色 编码 的 外 部 链接 表示 结构 外 可 达 的 地 点 。 由 于 用 户 不 能 改变 位 置 历史 信息 ， 因 此 
面包 导 一 词 在 本 例 中 的 相关 性 可 能 还 值得 商 梭 。 





图 5-40 位 置 历史 信息 (红色 ) 提供 了 结构 信息 ， 同 时 也 显示 了 用 户 当前 位 置 ( 见 彩 图 ) 


将 某 个 地 点 内 的 路 径 历史 信息 明确 显示 是 很 有 用 的 。 图 5-41 是 一 个 网 页 示例 : 网 站 入 口 是 
“Poole” 而 非 “Fine Hotels”"， 从 这 里 用 户 可 以 扩展 访问 范围 。 决 定 是 否 使 所 有 位 置 历史 信息 
变 得 可 交互 从 而 增强 额外 的 SI 并 不 是 一 个 容易 的 任务 : 交互 设计 师 还 要 综合 考虑 网 站 设计 的 其 
他 要 求 。 位 置 历 史 信息 的 提供 和 设计 需要 特别 注意 一 个 不 常见 但 可 能 令 人 诅 形 的 问题 : 搜索 引 
擎 返回 的 页 面 只 提示 “我 的 观点 是 ……”， 而 没有 提 到 作者 或 与 之 相关 的 组 织 或 公司 信息 。 结 
构 的 交互 式 改 进 是 非常 有 用 的 。 


网 站 内 的 路 径 历史 信息 







Sandbanks Hotel 








Sendbenks | Hotel 


15 Banks R Shanks Poole, Dorset, BH13 IPB 
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图 5-41 某 网 站 内 的 路 径 历史 信息 示例 


3. 实验 研究 

Field 和 Apperley (1990) 的 实验 可 能 是 对 路 径 历 史 信 息 及 其 效用 的 最 早 且 最 全 面 的 实际 研 
究 。 为 了 在 较 大 的 非 规范 的 菜单 系统 中 通过 定位 来 解决 涉及 多 个 选项 的 复杂 任务 ， 该 研究 移 去 
了 Snowberry 及 其 同事 的 研究 中 设置 的 很 多 限制 条 件 。 他 们 通过 探索 、 支 持 回溯 (通过 交互 历 
史 信 息 得 以 实现 ) 等 Snowberry 研 究 中 特别 禁止 的 方法 来 增强 系统 的 实用 性 。 该 实验 针对 的 信 
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息 空 间 是 “videotext” 数 据 库 ， 它 描述 了 虚拟 城市 Carlton 及 其 夜间 娱乐 活动 (如 旅行 、 看 电影 、 
素食 餐厅 等 ) 信息 。 

Field 和 Apperley 比 较 了 图 5-42 所 示 的 两 个 菜单 系统 。 左 边 的 是 标准 菜单 ， 人 允许 在 主页 或 刚 
访问 过 的 页 面 中 进行 菜单 选择 或 短命 令 操作 。 右 边 的 叫 选 择 性 回 滴 ， 不 仅 展示 了 每 层 上 所 有 可 
选项 的 历史 信息 ( 即 路 径 历 史 信息 )， 也 允许 通过 数字 选择 来 进行 回溯 。 


1 Regent “One man, two women” | Regent “One man, two women’ 
2 Mayfair "Breakout" 2 Mayfair “Breakout” 

3 Cinema One “Flashdance” 3 Cinema One “Flashdance” 

4 Embassy “Schweitzer” 4 Embassy “Schweitzer” 

5 Carlton ‘All ends up” 5 Carlton ‘All ends up” 





图 $-42 经 过 Field 和 Apperley (1990) 比较 的 两 种 菜单 系统 


我 们 在 这 里 不 讨论 该 实验 的 大 量 实验 结果 和 结论 。 例 如 ， 两 种 菜单 系统 中 评估 过 的 页 面 数 
存在 着 较 大 的 差异 (标准 菜单 50.3， 选 择 性 回溯 菜单 39.7)。 如 果 将 “效率 ”定义 为 “距离 目 
标的 最 小 页 面 数 /实际 页 面 数 ”"， 则 两 种 系统 的 效率 分 别 为 51.3% 和 63.3%。 

在 我 们 的 讨论 范围 内 ，Field 和 Apperley 实 验 中 最 重要 的 结论 是 使 用 选择 性 回溯 结构 的 用 户 
对 数据 库 的 复杂 度 有 着 更 好 的 理解 ， 他 们 对 Carlton 城 有 着 更 好 的 上 下 文 认 知 ( 即 内 部 模型 ) 。 
正如 Dahlback (1988) 所 提醒 的 ， 定 位 不 仅 是 对 信息 空间 的 学 习 ， 更 是 对 它 的 使 用 。 


5.3.7 支持 定位 的 设计 指导 原则 


我 们 在 本 节 中 介绍 了 敏感 度 、 残 留 物 和 气味 以 及 相关 典型 例子 。 对 “交互 设计 师 如 何 利用 
这 些 概念 ? ”这 一 中 心 问题 的 简要 回答 是 ， 虽 然 这 些 概念 可 以 指导 支持 定位 的 交互 设计 ,但 并 
未 指定 交互 如 何 进行 。 原 因 很 简单 : 网 页 设计 受 很 多 因素 制约 ， 而 定位 是 其 中 很 重要 的 因素 之 
一 。 当 我 们 关注 定位 时 ， 有 很 多 和 定位 线索 相关 的 技术 ， 而 视觉 /图 形 设计 是 其 中 的 重要 技术 
之 一 。 因 此 ， 即 使 优先 考虑 其 他 因素 ， 敏 感度 、 残 留 物 和 气味 等 概念 也 能 作为 支持 定位 的 交互 
设计 的 指导 标准 。 

考虑 到 用 户 已 对 Web 和 其 他 信息 系统 有 一 定 的 经 验 ， 定 位 重要 性 的 另 一 个 度量 标准 是 为 网 
页 定位 所 分 配 的 显示 面积 。 在 Nielsen 和 Tahir (2002) 对 50 个 网 页 的 批评 中 ， 定 位 显示 区 域 所 
占 的 范围 在 3% 一 48%， 平 均值 为 22%。 定 位 重要 性 还 体现 在 为 “内 容 ” 分 配 的 显示 区 域 ， 在 8 
个 例子 中 从 0 一 50% 不 等 。 大 致 分 为 两 类 : 一 类 在 30% 一 50%， 另 一 类 在 0 一 14%。 因 此 ， 和 预 
期 相反 ， 为 定位 分 配 的 显示 区 域 通常 和 为 内 容 分 配 的 显示 区 域 的 大 小 成 正比 。 


5.4 被 动 式 交互 


我 们 首先 要 认识 到 被 动 式 交 互 的 两 个 特点 : 首先 ， 在 可 视 化 工具 的 典型 使 用 过 程 中 ， 用 户 
的 大 多 数 时 间 用 于 大 量 的 眼球 活动 和 高 阶 认 知 处 理 ， 其 次 ， 被 动 式 交互 并 不 意味 着 静止 的 数据 
描述 ， 很 多 因素 决定 了 数据 描述 可 能 是 快速 可 变 的， 用 户 可 以 通过 观察 这 些 描述 而 受益 。 这 些 
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特点 将 在 以 下 的 实例 中 得 到 具体 展现 。 


5.4.1 静态 显示 

针对 特定 的 问题 ， 我 们 可 以 设计 出 相应 的 静态 描述 如 Minard 地 图 ， 也 可 以 根据 用 户 的 “ 授 
权 ” 进 行 设 计 ， 如 EZChooser。 遗 憾 的 是 ， 人 们 常常 将 连续 性 交互 以 及 渐进 式 交互 视 作 “先进 
的 ”或 “很 酷 的 ”设计 ， 而 将 静态 显示 看 做 是 “技术 含量 不 高 的 "。 其 实 这 样 的 观点 是 不 对 的 。 
从 本 质 上 讲 ， 在 用 户 做 出 选择 前 ， 渐 进 式 交 互 过 程 中 的 每 一 帧 都 是 静态 的 。 因 此 ， 从 减少 认 知 
成 本 和 鼠标 点 击 次 数 的 角度 来 看 ,交互 设计 师 应 该 考虑 到 引入 静止 数据 描述 可 能 会 带 来 的 好 处 。 
第 2 章 中 介绍 的 EZChooser 是 一 个 简单 而 具有 说 服 力 的 例子 。 要 回答 “如 果 我 们 查看 下 一 个 价 
格 或 MPG 区 间 会 看 到 什么 ”这 样 的 问题 ， 用 户 可 以 简单 地 先 点 击 一 个 价格 区 间 ， 观 察 结果 后 
取消 这 个 选择 ， 再 选择 一 个 MPG 区 间 ， 然 后 对 结果 进行 观察 。 不 同 于 这 样 的 常规 做 法 ， 
EZChooser 的 设计 师 在 静态 描述 的 基础 上 加 入 了 “边界 汽车 ”的 概念 ， 这 样 不 需要 交互 和 大 量 
认 知 成 本 也 可 以 回答 上 述 问题 。 和 常用 的 “ 先 走 后 看 ”( 动 态 查 询 ) 方法 不 同 ， 静 态 显示 使 用 
的 是 “ 先 看 后 走 ” 的 方法 。 正 如 Rao 所 提出 的 问题 ， 

你 去 印度 难道 只 是 想 看 看 你 到 底 愿 不 愿意 待 在 那儿 吗 ? 


5.4.2 浏览 


视觉 交互 常常 和 一 系列 的 眼球 活动 联系 在 一 起 。 考 虑 到 人 类 视觉 系统 在 信息 可 视 化 中 的 基 
础 性 地 位 ， 我 们 应 该 对 该 系统 ， 尤 其 是 常用 术语 的 定义 做 更 深入 的 讨论 。 

人 类 的 视线 在 有 意识 的 前 提 下 是 不 停 变化 的 。 当 视线 聚焦 在 某 个 特定 事物 时 Potter 
(1999) 提出 的 概念 型 短期 记忆 (conceptual short-term memory) 显示 ， 对 于 视线 捕捉 到 的 图 
片 ， 人 们 首先 是 感知 并 将 其 储存 在 感官 存储 区 内 ， 然 后 对 其 做 解释 和 评估 。 整 个 过 程 最 多 可 能 
持续 大 约 500 毫 种 ， 可 以 叫做 内 容 评 价 (assessment of content) 或 浏览 (browsing). 

浏览 一 词 在 很 多 语 境 中 都 带 有 偶然 的 意味 。 虽 然 可 以 将 视觉 凝视 看 作 是 偶然 的 行为 ， 我 们 
还 是 认为 应 该 将 浏览 分 成 以 下 三 种 类 型 ; 

。 探 察 式 浏览 (exploratory browsing) 指 为 可 见 场景 建立 内 部 模型 的 视觉 凝视 活动 。 因 此 

在 一 个 书店 内 (图 5-43)， 用 户 可 以 通过 扫描 发 现 第 四 个 书柜 放 的 是 心理 学 类 书籍 。 

。 随 机 式 浏览 (opportunistic browsing) 指 “ 看 看 有 什么 ”而 非 建 模 的 视觉 凝视 活动 。 例 
如 ， 刚 进入 聚会 场所 ， 我 可 能 很 快速 地 扫 视 ， 看 有 设 有 熟悉 的 面孔 。 

。 无 意 式 浏览 (involuntary browsing) 是 非 直接 的 ， 并 且 没 有 任何 明确 的 意图 。 它 描述 了 
常见 的 人 类 视觉 活动 模式 。 如 图 5$-4 所 示 ， 用 户 可 能 在 喝 咖 啡 时 无 意 间 发 现 旧 上 的 一 张 有 
趣 的 图 片 。 

如 图 5-43 所 示 ， 用 户 通过 探索 式 浏览 发 现 第 四 个 书架 放 着 心理 学 类 书籍 。 我 们 可 以 对 第 四 

个 书架 做 一 次 新 的 探索 式 浏览 ， 为 它 的 内 容 建 立 一 个 模型 。 此 时 ， 我 们 注意 的 区 域 焦点 进入 了 
GER) 信息 空间 ， 聚 集 在 这 个 特定 的 书架 上 并 为 其 内 容 建 模 。 在 此 区 域内 做 探索 式 浏 览 可 以 
发 现 和 认 知 心理 学 、 诊 所 心理 学 以 及 社会 心理 学 有 关 的 内 容 。 在 这 一 过 程 中 ， 用 户 的 注意 力主 
要 集中 在 连续 信息 空间 内 的 用 户 自 定义 区 域 中 ， 这 和 离散 信息 空间 内 的 渐进 式 交 互 过 程 中 可 能 
产生 一 系列 的 用 户 选择 的 位 置 (如 网 页 等 ) 很 类 似 。 因 此 我 们 也 可 以 使 用 定位 一 词 。 
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第 3 个 区 域 焦点 


图 5-43 对 认 知 心理 学 感 兴趣 的 用 户 对 书架 的 视觉 浏览 示意 图 。 第 1 个 区 域 焦点 集中 在 红色 部 分 ， 
通过 对 所 有 书籍 的 探 察 发 现 心理 学 的 书籍 大 多 集中 在 绿色 区 域 (第 2 个 区 域 焦点 )。 对 该 
区 域 的 研究 发 现 认 知心 理学 集中 在 蓝 色 区 域 (第 3 个 区 域 焦点 ) ( 见 彩 图 ) 


5.4.3 动态 显示 


“数据 驱动 ”的 动态 数据 描述 可 以 带 来 很 多 的 好 处 ， 但 用 户 并 不 像 在 连续 或 渐进 式 交 互 中 
一 样 对 活动 做 直接 控制 。 在 “动态 流 ” 显 示 模 式 中 (图 5-44)， 货 币 经 纪 人 关注 美元 和 欧元 间 
的 货币 交易 率 。 根 据 全 球 范围 内 的 实时 动态 ， 图 形 每 隔 4 秒 刷 新 一 次 。 这 里 的 交互 是 被 动 的 ， 
经 纪 人 只 是 对 显示 做 监视 并 根据 经 验 做 决策 。 我 们 以 往 认 为 是 最 不 重要 的 变化 在 这 个 例子 中 反 
而 是 最 重要 的 信息 ! 


BL UR USD 
时 间 


EURSD 


1.24 1.24 


EURWSD 


EURUSD 





etc. 


图 5-44 美元 对 欧元 汇率 比 的 连续 变化 描述 
动态 显示 的 第 二 个 例子 是 为 了 更 好 地 理解 算法 而 对 算法 改进 过 程 进行 观察 (Pu and 
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Lalanne, 2000; Wright et al., 2000). 图 5-45 所 示 的 系统 界面 (Colgan et al., 1995) 通过 结合 两 
种 方法 来 帮助 用 户 进行 电路 设计 。 第 一 种 方法 是 通过 优化 算法 对 原始 电路 设计 的 某 些 参数 做 自 
动 调整 来 尽量 缩小 电路 实际 性 能 和 设计 目标 之 间 的 差距 。 优 化 算法 的 作用 是 毋庸 置疑 的 ， 但 
是 9S ， 如 果 用 户 可 以 根据 个 人 经 验 对 算法 的 运行 过 程 进行 监控 ， 将 有 效 提高 算法 的 效率 ， 并 帮 
助 其 达到 自动 运行 所 不 能 达到 的 高 度 。 优 化 过 程 中 的 各 种 相对 性 和 相关 性 的 发 现 是 监控 过 程 中 
很 有 用 的 附加 产物 。 


预计 性 能 和 实际 性 能 
之 间 的 差异 


AAA 


有 





参数 值 


图 5-45 人 允许 用 户 指导 的 电路 自动 设计 系统 草图 。 时 钟 指针 的 移动 代表 优化 算法 的 迭代 行为 。 蓝 
色 条 状 和 红色 圆圈 的 大 小 分 别 表 示 算 法 选择 的 参数 值 和 电路 的 各 种 性 能 指标 。 设 计 师 可 
以 在 任意 时 刻 暂 停 算法 的 运行 、 改 变 算法 细节 或 设置 算法 性 能 的 某 些 限定 条 件 ( 见 彩 图 ) 


同 飞行 员 指挥 自动 飞行 模式 下 的 飞行 类 似 ， 图 5-45 描 述 了 优化 算法 的 运行 过 程 。 层 次 结构 
对 应 于 算法 性 能 。 最 高 层 的 圆 表示 整体 性 能 的 函数 相关 性 ， 第 二 层 圆 表示 各 种 重要 属性 。 红 色 
圆 的 大 小 表示 预计 性 能 和 实际 性 能 之 间 的 差异 ， 因 此 圆 越 小 说 明 性 能 越 好 8 。 算 法 的 目的 在 于 
通过 反复 修改 参数 来 取得 更 好 的 运行 性 能 : 设计 师 观察 圆 的 大 小 变化 以 及 算法 自动 选择 的 参数 
E ( 蓝 色 条 状 )， 根 据 自 身 经 验 来 提高 优化 性 能 。 在 设计 师 做 出 任何 干预 之 前 ， 整 个 交互 过 程 
都 是 被 动 的 。 

被 动 式 交互 的 第 三 个 例子 是 图 5-4 所 示 的 咖啡 桌 隐 喻 。 在 用 手指 将 图 片 推 到 桌面 的 中 心 位 
置 而 实现 语义 缩放 前 ， 用 户 没有 进行 其 他 的 物理 活动 。 根 据 Norman 行 动 周期 (图 5-46) 对 所 
发 生 的 事件 进行 分 析 是 很 有 用 的 。 首 先 ， 我 们 从 意图 入手 。 我 们 要 认识 到 人 的 意图 可 能 是 多 样 
的 。 这 些 意图 存在 于 长 期 记忆 中 ， 通常 情况 下 用 户 没 有 将 它们 清楚 地 表达 出 来 。 例 如 ， 当 人 很 
渴 的 时 候 会 将 注意 力 放 在 喝 咖啡 上 ， 即 使 他 是 个 象棋 爱好 者 ， 在 这 种 情况 下 通常 不 会 表达 这 些 
个 人 爱好 ， 从 而 避免 形成 行动 计划 的 认 知 行为 。 当 无 意 间 看 到 一 张 棋 盘 图 片 后 ， 用 户 会 由 于 个 


© 如 同 Douglas Hitchhiker 在 《Guide to the Galaxy》 一 书 中 描述 的 ， 优 化 算法 的 结果 有 了 时 和 计算 机 返回 值 “42” 
相关 ， 这 意味 着 所 得 到 的 答案 是 不 明确 的 。 

O 圆 的 大 小 代表 电路 实际 性 能 和 设计 目标 之 间 的 差距 ， 这 可 能 导致 一 种 奇特 的 结果 : 完美 电路 对 应 的 贺 大 
小 为 0!。 
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人 爱好 而 对 其 做 感知 、 解 释 和 评估 。 在 意识 到 相关 性 之 前 ， 用 户 并 未 投入 任何 的 认 知 成 本 。 如 
果 看 到 的 图 片 是 和 个 人 兴趣 无 关 的 ， 用 户 会 轻易 地 就 将 其 忘记 (Potter, 1999)。 广 告 人 员 应 该 


对 以 上 用 户 行为 非常 熟悉 。 


评估 海湾 


图 5-46 偶然 式 浏览 的 Norman 行 动 周期 框架 


5.5 混合 型 交互 


在 实际 应 用 中 ， 当 任何 单独 的 交互 模式 均 不 能 够 提供 最 有 效 的 解决 方法 时 ， 多 种 模式 的 组 
A (混合 型 交互 ) 是 更 为 合适 的 选择 。 由 于 涉及 的 数据 可 能 很 多 ， 因 此 需要 用 到 渐进 式 交 互 来 
为 基于 连续 和 被 动 式 交互 的 进一步 探索 设 定 一 个 合适 的 数据 子 集 。5.4 节 中 讨论 过 的 自动 设计 
系统 就 是 一 个 很 好 的 例子 ( 见 图 5-45) : 在 监控 自动 设计 的 过 程 中 使 用 到 的 被 动 式 交互 常 过 渡 
到 渐进 式 交互 (检查 红色 圆圈 所 包含 的 细节 信息 ) 或 连续 性 交互 (探索 红色 圆圈 所 构成 的 树 的 
层次 关系 ) 。 

我 们 将 从 设计 的 角度 来 讨论 混合 型 交互 。 现 有 很 多 经 济 的 、 电 子 的 、 水 压 的 以 及 工程 学 等 
设计 原则 ， 但 设计 师 始终 关心 两 类 中 心 问题 。 参 数 指 用 户 可 设 定 的 变量 。 工 程 设 计 师 可 以 设 定 
轴承 半径 或 钢板 厚度 ， 金 融 或 投资 设计 师 可 以 决定 投资 金额 ， 电 子 电 路 设计 师 可 以 设 定 电阻 器 
值 以 及 芯片 尺寸 。 参 数值 的 选择 影响 着 对 象 的 性 能 ， 对 于 工程 设计 师 可 能 是 引擎 的 刹车 马力 ， 
对 于 金融 设计 师 可 能 是 投资 的 风险 与 回报 ， 对 电路 设计 师 可 能 是 iPod 放大 器 。 


影响 


现 有 很 多 软件 包 可 以 预测 特定 参数 的 选择 所 对 应 的 性 能 ， 从 而 帮助 设计 师 理解 参数 选择 对 性 
能 的 影响 。 虽 然 这 类 信息 很 有 用 ， 但 它 和 设计 师 的 任务 并 非 直接 相关 的 ， 性 能 的 可 接受 范围 是 由 
用 户 决 定 的 ， 然 后 设计 师 才能 对 参数 值 进行 适当 的 选择 。 因 此 设计 师 需 要 了 解 性 能 限制 条 件 对 参 
数值 的 影响 。 设 计 师 要 考虑 的 另 一 类 影响 是 性 能 之 间 的 相互 影响 关系 。 因 此 ， 金 融 设计 师 需 要 权 
稀 收 益 和 风险 ， 工 程 设计 师 需要 明确 气 氏 大 小 和 刹车 马力 之 间 的 平衡 关系 。 我 们 将 看 到 ， 信 息 可 
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视 化 可 以 帮助 设计 师 对 这 三 类 影响 进行 探索 (Tweedie er al., 1995, 1996; Spence, 1999)。 

为 了 简化 讨论 ， 我 们 假设 需要 设计 的 对 象 可 描述 为 两 个 参数 X1 和 X2， 用 户 对 两 个 性 能 S1 
和 S2 感 兴趣 。 我 们 假设 用 户 已 经 对 S1 和 S2 设 定 了 限制 范围 。 为 了 讨论 以 上 提 到 的 各 类 影响 ， 
必须 首先 生成 一 些 数据 。 通 常 ， 设 计 师 应 该 对 可 能 的 设计 所 对 应 的 参数 空间 有 所 了 解 ， 为 所 有 
可 能 的 设计 生成 一 个 如 图 5-47a 所 示 的 随机 分 布 的 集合 (其 中 的 每 个 点 对 应 一 种 设计 方案 )， 然 
后 为 每 种 设计 对 应 的 性 能 S1 和 S2 生 成 一 个 模拟 包 (图 5-47b)。 在 这 个 简单 的 示例 中 ， 我 们 看 
到 ， 性 能 空间 (图 5-47b) 中 的 可 接受 区 域内 的 点 都 可 以 通过 回溯 找到 适合 的 参数 值 X1 和 X2 
(图 5-47a) 。 从 图 中 还 可 以 看 出 S1 和 S2 之 间 存 在 着 一 定 的 相对 性 。 


a) 





0.01 0.02 


图 5-47 对 参数 空间 内 随机 生成 的 设计 方案 a) 进行 模拟 ， 对 应 的 属性 显示 在 性 能 空间 b) 中 。 在 
性 能 空间 b) 中 选择 的 合适 性 能 可 以 回溯 到 参数 空间 a) 中 对 应 的 设计 方案 


实际 的 设计 常常 涉及 很 多 必须 要 遵守 的 参数 和 性 能 限定 条 件 。 但 解决 方法 从 本 质 上 来 讲 和 
图 5-47 所 示 的 例子 是 一 样 的 ， 对 参数 空间 的 某 个 区 域内 的 设计 做 模拟 ， 找 到 对 应 的 性 能 ， 结 果 
如 图 5-48 所 示 : 某 结构 (例如 灯泡 内 的 灯丝 ) 表示 为 X1~X4 四 个 参数 ， 用 户 对 S1~S4 四 个 性 能 
(结构 内 的 压力 ) 感 兴趣 。 如 同属 性 浏览 器 中 对 应 于 每 栋 房屋 的 直方 图 ， 本 例 中 的 每 个 设计 可 
以 定义 为 8 个 直方 图 ， 图 5$-48 显 示 了 其 中 的 4 个 。 

图 5-48 所 示 的 性 能 直方 图 的 优点 在 于 可 以 为 任意 参数 或 性 能 设置 限定 条 件 ， 对 其 他 所 有 直 
方 图 的 扫 光 操作 可 以 看 做 是 连续 交互 。 因 此 我 们 在 图 5-49 中 看 到 ， 可 以 通过 用 户 对 S1~S4 所 设 
置 的 限定 条 件 来 对 参数 直方 图 做 扫 光 操作 ， 红 色 表 示 能 产生 适当 性 能 的 参数 组 合 。 可 以 通过 放 
宽 参数 限制 条 件 来 取得 新 的 设计 方案 。 如 同属 性 浏览 器 中 对 参数 限制 条 件 的 调整 ， 连 续 交 互 可 
以 帮助 设计 师 在 和 用 户 协商 的 基础 上 探索 调整 性 能 限制 条 件 。5.2 节 展示 了 如 何在 S4 和 S53 之 间 
取得 平衡 。 以 上 讨论 到 的 探索 机 制 可 以 参见 影响 浏览 器 (Influence Explorer, Tweedie et al., 
1995, 1996), 
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图 5-49 根据 对 参数 S1~S4 所 做 的 条 件 限制 对 参数 直方 图 做 扫 光 操作 ， 红 色 表 示 满 足 S1~S4 限 定 条 


件 的 参数 组 合 (MEA) 
剖析 
以 上 实例 中 的 数据 可 以 显示 在 一 个 剖析 矩阵 (prosection matrix, Furnas and Buja, 1994; 


Tweedie and Spence, 1998) 中 〈 见 图 5-50) 。 一 个 剖析 和 一 组 参数 有 关 ， 并 在 二 维 参数 空间 中 
显示 所 有 选 定 参数 范围 内 (如 某 个 部 分 ) 的 设计 的 投影 。 同 属性 浏览 器 的 颜色 编码 一 样 ， 满 足 


所 有 性 能 限定 条 件 并 落 在 可 接受 区 域内 的 设计 显示 为 红色 ， 唯 一 不 满足 一 个 性 能 限定 条 件 的 显 
示 为 黑色 。 
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图 5-50 有 四 个 参数 的 设计 剖析 矩阵 。 红 色 表 示 满 足 所 有 性 能 限制 条 件 的 设计 ， 黄 色 表 示 放 宽 参 
数 限制 条 件 后 大 规模 生产 所 对 应 的 设计 ( 见 彩 图 ) 


在 传统 设计 中 ， 设 计 师 对 合适 的 属性 或 性 能 的 初始 范围 缺少 想法 。 训 析 和 矩阵 的 主要 优点 在 
于 帮助 设计 师 为 所 有 参数 选择 一 组 特定 值 从 而 使 设计 落 在 红色 区 域内 。 认 识 到 参数 应 落 在 允许 
范围 内 后 ， 针 对 大 规模 制造 的 设计 任务 ， 设 计 师 可 以 在 规定 范围 内 设置 一 个 高 维 的 容忍 度 盒子 
(Spence and Soin, 1988) : 该 盒子 的 范围 就 是 图 5-50 中 显示 为 黄色 的 区 域 。 设 计 师 可 以 连续 移 
动 这 个 盒子 ， 系 统 应 为 对 应 设计 所 能 带 来 的 收益 提供 相应 的 线索 信息 。 


5.6 交互 动态 性 


5.6.1 心理 模型 


在 Norman 动 作 周 期 模型 中 ， 执 行 的 结果 是 “改变 世界 ”或 “改变 数据 视图 ”， 并 且 显 示 为 
一 个 单独 的 盒子 。 考 虑 到 变化 可 能 是 即时 的 (我们 下 面 会 谈 到 ， 非 即时 也 许 更 有 用 ) ， 我 们 需 
要 对 这 个 盒子 做 进一步 的 讨论 ， 特 别 是 对 数据 的 新 旧 视图 间 的 转换 问题 (图 5-51) 。 






世界 的 变化 


670 


图 5-51 基于 信息 可 视 化 ，Norman 的 “改变 世界 ”一 -说 对 应 于 数据 新 旧 视 图 的 交替 
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第 3 章 中 介绍 的 锥 形 树 (Robertson et al., 1991) 反映 了 渐进 式 交互 中 产生 的 视觉 变化 的 动 
态 性 本 质 ( 见 图 5-52)。 用 户 可 以 通过 命令 找到 一 个 特定 的 结 点 ， 该 结 点 以 及 其 子 树 中 的 所 有 
结 点 会 自动 旋转 到 视图 的 正面 ， 这 样 就 可 以 方便 对 锥 形 树 的 使 用 和 理解 。 如 果 用 户 想 要 查看 另 
一 个 结 点 ， 则 类 似 的 旋转 会 再 次 发 生 ， 此 时 出 现 一 个 交互 设计 问题 。 如 果 和 第 二 个 焦点 顶点 相 
关 的 旋转 立即 发 和 的话， 用户 在 上 一 旋转 过 程 中 对 该 锥 形 树 建 立 的 心理 模型 可 能 会 遭 到 丢失 或 
破坏 。 如 果 引 入 持续 一 秒 左右 的 动画 来 保证 两 个 状态 ( 即 两 个 旋转 ) 间 的 平滑 过 渡 ， 就 可 以 保 
证 对 象 的 稳定 性 ( 换 句 话说 ， 在 物理 世界 里 ， 锥 形 始终 是 锥 形 )， 用 户 从 第 一 个 描述 中 取得 的 
内 部 模型 受到 的 破坏 就 会 较 少 ， 而 用 户 对 该 树 的 心理 模型 可 以 得 到 增强 。 在 一 个 描述 锥 形 树 的 
视频 里 ，Card 评 论 到 :“ 如 果 没 有 动画 ， 用 户 将 花 上 数秒 时 间 来 重 塑 树 的 各 部 分 之 间 的 关系 ”， 
即 重建 心理 模型 。 连 续 交 互 和 渐进 式 交互 存在 着 较 大 区 别 : 连续 性 交互 需要 即时 反馈 ， 而 即时 
反馈 不 一 定 是 渐进 式 交互 的 最 佳 选择 。 





图 5-52 锥 形 树 


即使 没有 对 应 的 物理 隐喻 ， 通 过 渐进 式 交互 取得 的 两 个 离散 视图 间 的 人 工 动画 还 是 很 有 用 
的 。 图 5-53a 中 的 圆圈 表示 多 个 国家 的 国民 生产 总 值 (GNP)， 圆 圈 大 小 对 应 于 GNP 值 。 在 渐进 
式 交互 中 ,年份 的 更 改 会 导致 视图 立即 变 成 图 $-533b。 用 户 可 能 会 花费 一 定 的 时 间 才 能 理解 视图 
发 生 的 变化 。 然 而 ， 如 果 引 入 持续 时 长 在 一 秒 以 内 的 动画 来 描绘 两 个 视图 间 的 变化 (如 图 5-53c 
所 示 )， 即 使 这 些 变 化 完全 是 人 工 生 成 的 ， 图 5-53a 和 图 5-53b 之 间 的 变化 也 将 比较 容易 理解 。 

国家 





图 5-53 可 以 通过 动画 表示 的 图 c) 来 描绘 视图 a) 和 b) 之 间 的 转化 ( 见 彩 图 ) 
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5.6.2 Bill 

视图 变化 的 首要 前 提 条 件 是 保证 视觉 变化 应 是 可 察觉 的 ， 否 则 会 带 来 负面 效应 。 我 们 主要 
讨论 违反 直觉 的 并 且 大 家 可 能 觉得 难以 置信 的 两 种 现象 。 交 互 设计 师 ， 特 别 是 安全 性 要 求 很 高 
的 应 用 的 设计 师 ， 必 须要 对 这 两 种 现象 有 所 了 解 (DiVita et al., 2004) 。 

1. ELAM 

在 第 3 章 中 我 们 已 经 讨论 过 变化 言 视 (Change Blindness, CB, Rensink et al., 2000; Rensink， 
2002; Rensink URL): 驾驶 员 没 有 注意 到 飞行 高 度 计 的 变化 。 通 过 对 CB 现象 的 分 析 ， 我 们 可 
以 看 到 ， 人 类 视觉 系统 不 能 自动 存储 已 观察 过 的 物体 的 细节 记忆 。 换 句 话说 ， 人 们 记 住 的 不 是 
组 成 一 幅 画面 的 所 有 像素 ,而 是 一 个 站 在 人 行道 上 的 穿 蓝 色 西 服 的 人 钻 进 了 一 辆 黄色 的 出 租车 。 
如 果 在 短暂 间隔 (通常 不 超过 40 毫 秒 ) 后 将 这 个 画面 替换 为 另 一 个 非常 相似 、 只 有 部 分 细节 不 
同 的 画面 例如， 画面 里 有 个 路 人 经 过 ) ， 则 人 们 对 新 画面 的 心理 模型 很 有 可 能 和 原来 的 画面 
是 一 样 的 ， 也 就 是 说 ， 和 人 们 很 有 可 能 没有 注意 到 画面 的 变化 (Rensink 的 URL)。 

当 人 们 的 目光 在 扫 视 时 也 有 可 能 注意 不 到 变化 。Grimes (1996) 的 研究 发 现 即使 是 针对 真 
实 的 场景 ， 当 变化 产生 在 眼球 活动 期 间 时 ,人们 也 很 有 可 能 察觉 不 到 这 些 变 化 。 在 某 个 实验 中 ， 
当 变化 产生 在 扫 视 期 间 时 ，50% 的 参与 者 没 能 发 现 两 个 人 交换 了 头 部 。 

2. 非 注意 盲 视 

研究 信息 可 视 化 的 交互 设计 师 需 要 注意 的 另 一 个 “ 盲 视 ”现象 叫 非 注 意 畜 视 
(Inattentional Blindness, IB), 我 们 在 第 1 章 中 讨论 过 这 个 现象 (Simons and Chabris, 1999), 
当 参 与 者 被 要 求 观察 一 段 视频 时 ,有 些 人 没有 注意 到 画面 后 方 有 个 人 装扮 成 大 猩猩 的 模样 走 过 。 
其 他 关于 非 注意 言 视 的 、 令 人 惊讶 的 违反 直觉 的 例子 可 参见 参考 文献 (Varakin et al., 2004)。 

3. 消除 盲 视 的 设计 

Durlach (2004) 的 研究 部 分 回答 了 如 下 问题 :“ 作 为 交互 设计 师 ， 我 应 该 如 何 通 过 可 用 性 
测试 来 减少 变化 言 视 和 非 注意 寞 视 所 带 来 的 问题 ? ”。 每 种 解决 办 法 都 有 其 各 自 的 优 缺 点 。 例 
如 ， 提 供 “变化 警报 ”确实 可 以 提醒 用 户 变化 的 产生 ， 但 是 要 对 这 些 变化 做 出 反应 也 需要 用 户 
精力 的 投入 。 类 似 的， 对 信息 狐 新 度 的 编码 可 以 告诉 用 户 哪 些 信息 是 最 新 的 ， 但 可 能 会 增加 视 
觉 复 杂 度 ， 并 且 要 求 交 互 设计 师 找到 一 个 未 经 使 用 的 突出 的 编码 通道 。 以 上 提 到 的 只 是 
Durlach (2004) 列举 的 增强 变化 感知 方法 中 的 两 种 。 虽 然 在 音频 输入 领域 已 经 有 关于 CB 和 IB 
的 大 量 研究 工作 (例如 Cherry, 1953) ， 但 还 是 有 很 多 下 待 解决 的 问题 。 


5.6.3 视觉 要 素 


视觉 要 素 (visual momentum, Woods, 1984) 这 个 和 视觉 变化 相关 的 概念 最 早 来 源 于 电影 
中 的 场景 变换 。 例 如 ， 在 两 个 相连 的 场景 里 ， 演 员 要 保持 相同 的 发 型 。 这 正 是 众所周知 的 “ 连 
续 性 女孩 ”在 电影 制 片 过 程 中 的 重要 性 的 体现 。 我 们 将 这 个 原则 应 用 到 信息 可 视 化 领域 ， 例 如 
保持 网 站 的 不 同 网 页 间 风 格 的 一 致 性 。 如 果菜 单 在 新 网 页 中 改变 了 位 置 ， 或 者 页 丑 颜 色 由 于 不 
知名 的 原因 而 改变 了 ， 这 些 都 会 造成 用 户 的 困惑 。 从 更 普遍 的 角度 来 看 ， 高 视觉 要 素 意味 着 用 
户 花 最 少 的 认 知 成 本 就 能 将 新 的 场景 融入 到 已 看 过 的 场景 中 去 。 从 本 质 上 来 讲 ， 要 素 对 应 着 心 
理 模 型 。 当 进入 新 的 相关 页 面 时 ， 用 户 不 应 该 抛弃 初始 模型 而 重建 新 模型 ， 而 应 该 只 是 丢弃 原 
模型 的 一 部 分 ， 将 认 知 成 本 用 在 新 的 具有 丰富 信息 的 部 分 。 网 页 设计 师 和 电影 导演 都 需要 众 所 
周知 的 “连续 性 女孩 ”! 
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5.7 交互 设计 


本 章 主 要 讨论 的 交互 技术 为 交互 设计 师 提供 了 信息 可 视 化 设计 指导 原则 中 的 最 后 一 个 和 交 
互 有 关 的 调 色 板 。 和 前 面 提 到 的 关于 数据 描述 和 数据 表示 的 调 色 板 一 样 ， 交 互 调 色 板 提供 了 丰 
富 的 概念 和 技术 ， 图 5-54 显 示 了 其 中 一 部 分 。 





图 5-54 同 交互 有 关 的 概念 和 技术 的 调 色 盘 


当 要 设计 一 个 可 以 为 信息 可 视 化 带 来 很 多 益处 的 交互 应 用 ， 如 投资 计划 、 汽 车 或 新 型 洗衣 
机 等 ， 需 要 有 效 地 用 到 所 有 调 色 板 。 目 前 不 存在 可 以 保证 成 功 的 甚至 只 是 合适 设计 的 分 步 指导 
原则 S。 原 因 很 简单 :新 的 界面 都 是 不 同 的 ， 而 且 通 常 是 复杂 的 ， 它 们 需要 满足 很 多 不 同 的 
(例如 社会 的 、 技 术 的 、 经 济 的 ) 需求 ， 可 使 用 的 技术 随 着 时 间 的 推移 而 不 断 变 化 ， 与 之 有 关 
的 理论 知识 如 认 知 心理 学 和 视觉 设计 等 也 在 不 断 地 变化 。 设 计 是 高 度 创造 性 的 活动 ， 而 “致命 
性 武器 ”是 不 存在 的 。 踏 入 一 间 工 作 室 (图 $-55) ， 你 就 会 立即 发 现 设计 是 协作 性 的 、 涉 及 交 
又 学 科 的 、 反 复 的 、 严 格 的 工作 。 同 设计 师 的 交谈 可 以 帮助 我 们 发 现 很 多 不 同 的 设计 原则 。 





图 5-55 交互 设计 过 程 。 可 见 的 特征 提醒 我 们 设计 的 协作 性 的 、 涉 及 交叉 学 科 的 、 反 复 的 、 严 格 
18i 的 本 质 (图 片 来 源 ， 感谢 UCD network Jk Alison Blacki ft) 


O 持 怀疑 态度 的 读者 可 以 尝试 为 从 拿破仑 东 征 记录 到 著名 的 Minard 地 图 设计 出 一 个 一 般 性 过 程 。 
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第 6 章 中 讨论 的 各 种 例子 将 为 我 们 展示 为 利用 信息 可 视 化 的 优势 而 对 交互 设计 的 复杂 度 进 
行 的 研究 。 设 计 的 复杂 度 来 源 于 很 多 方面 。 首 先 ， 要 充分 理解 目标 设计 所 要 支持 的 任务 ， 对 
已 有 技术 进行 综述 和 评估 ， 分 析 用 户 的 本 质 (新 手 ? 训练 过 的 用 户 ? 偶然 用 户 ? ) A 
标的 形成 过 程 以 及 相应 的 任务 ， 掌 握 现 有 技术 。 交 互 设计 师 必须 做 的 是 (通常 是 协作 性 的 )， 
认识 到 所 涉及 的 各 种 事物 ， 然 后 实施 他 认为 正确 的 界面 设计 步骤 。 协 作 通常 发 生 在 初始 草图 
的 形成 和 多 轮 实验 性 设计 中 。 当 然 ， 用 户 可 能 全 盘 否 定 或 只 部 分 接受 提交 的 设计 方案 ， 因 此 
会 有 多 轮 修 改 。 随 之 进行 的 可 用 性 测试 将 会 导致 更 多 的 修改 。 通 向 成 功 的 最 终 设计 的 路 途 并 
非 一 帆 风 顺 的 。 

在 第 3 一 5 章 的 讨论 中 我 们 看 到 信息 可 视 化 交互 设计 的 复杂 度 很 大 程度 上 通过 前 面 章节 中 介 
绍 的 数据 描述 、 表 示 及 交互 技术 得 以 降低 。 如 同一 个 称职 的 上 司 或 熟练 的 画家 ， 交 互 设计 师 必 
须 从 可 用 的 技术 中 选择 出 适合 的 ， 并 使 用 某 些 概念 对 它们 进行 有 机 组 合 ， 从 而 形成 有 效 产 品 。 
如 同 烹调 和 画 画 一 样 , 只 有 通过 实践 体会 到 好 的 和 不 好 的 设计 的 区 别 , 才能 设计 出 优秀 的 产品 。 
我 们 希望 第 6 章 中 将 要 讨论 的 各 种 案例 能 帮助 读者 加 强 对 前 面 讨 论 过 的 概念 和 技术 的 理解 ， 并 
且 为 交互 设计 提供 灵感 和 指导 。 


习题 


建议 通过 课堂 讨论 的 形式 来 加 深 对 以 下 习题 的 理解 。 

51 (复习 题 ) 用 一 句 话 解释 以 下 概念 ， (1) 被 动 式 交互 ;，(2) 渐进 式 交 互 :，(3) 动态 
交互 。 

5.2 (复习 题 ) 用 一 句 话 解释 以 下 概念 : (1) 敏感 度 ; (2) 残留 物 ; (3) 气味 ; (4) 历史 
信息 。 每 个 概念 各 自 的 主要 功能 是 什么 ? 

5.3 列举 一 个 交互 设计 的 例子 , 也 许 你 的 衣服 口袋 或 手袋 内 就 有 ,如 iPod、 手 机 或 相机 等 。 
要 求 选择 的 产品 不 是 类 似 于 售票 机 、 咖 啡 机 或 电梯 等 完全 电子 化 的 设备 。 

针对 选 定 的 产品 ， 分 析 它 是 如 何 支持 或 不 支持 Norman 行 动 周 期 模型 中 的 6 个 步 又 
的 。 如 果 可 能 ， 提 出 相应 的 改进 方案 。 在 班级 报告 中 ， 建 议 将 该 产品 支持 的 模型 细节 
画 在 一 张大 纸 上 ， 并 加 上 自己 或 他 人 的 意见 。 

5.4 根据 敏感 度 、 残 留 物 、 气 味 以 及 其 他 相关 概念 ,分 析 选 定 的 某 个 网 页 (不 是 一 个 网 站 ) 
的 不 足 ， 并 提供 相应 的 修改 方案 。 

5.5 在 习题 3.3 中 ， 你 为 5 位 学 生 的 8 科 成 绩 设计 了 一 种 数据 表述 方法 。 为 该 描述 加 上 合适 
的 交互 。 你 提出 的 方案 能 解决 习题 3.2 中 提 到 的 哪些 问题 ? 讨论 你 提出 的 动画 怎样 增 
强 对 象 /属性 可 见 性 以 及 相关 性 。 

56 现在 普遍 认为 属性 浏览 器 不 适用 于 针对 普通 大 众 的 网 页 设计 。 当 然 ， 敏 感度 信息 (如 
同 黑 色 房 屋 里 包含 的 一 样 ) 还 是 非常 重要 的 。 找 到 一 个 网 页 实例 (如 住房 、 汽 车 或 航 
线 等 )， 要 求 其 提供 属性 限制 ， 并 且 为 新 用 户 提 供 易于 理解 的 敏感 度 信息 。 描 述 这 个 
设计 的 主要 改进 之 处 。 

5.7 为 教师 提供 的 网 页 提出 支持 社会 化 定位 的 改进 方案 。 要 求 说 明 每 个 方案 的 优 缺 点 。 

5.8 习题 3.10 要 求 为 人 际 关系 〈 包 括 婚姻 状 况 、 出 生日 期 、 死 亡 信息 等 ) 设计 可 能 的 静态 
GEZE) 描述 ， 并 讨论 各 种 方案 的 优 缺 点 。 现 要 求 将 其 中 一 种 方案 变 为 交互 式 的 。 
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设计 

设计 是 时 间 中 的 某 一 时 刻 。 它 利用 过 去 ， 也 影响 着 未 来 。 

无 论 设计 的 是 界面 、 飞 机 还 是 金融 投资 ， 设 计 活动 都 不 可 避免 地 利用 了 过 去 的 设计 和 经 验 
(无 论 是 成 功 的 还 是 不 成 功 的 ) ， 它 尝试 着 发 挥 所 有 可 用 部 件 的 优势 ， 它 利用 现 有 的 技术 和 用 
户 需求 ， 它 是 对 市 场 需求 的 认 知 。 随 着 设计 的 进行 ， 测 试 评估 和 对 所 设计 的 产品 的 使 用 会 告诉 
设计 者 可 能 的 有 益 改 进 。 

因此 ， 设 计 是 个 动态 的 过 程 。 不 同 产品 的 设计 过 程 所 耗费 的 时 间 各 不 相同 : 飞机 研发 需要 
数 十 年 ， 产 品 生产 需要 数 月 ， 新 颖 的 界面 设计 可 能 只 需要 几 天 。 所 有 这 些 例子 的 共同 点 均 在 于 
人 类 行为 。 

无 论 是 作为 一 个 独立 的 工具 还 是 一 个 更 复杂 系统 的 一 部 分 ， 信 息 可 视 化 工具 的 设计 都 是 个 
工艺 流程 。 设计 师 (很 多 时 候 是 多 名 合作 设计 师 ) 在 已 知 概念 和 技术 的 基础 上 发 掘 新 颖 的 想法 ， 
设计 出 创造 性 的 产品 。 从 这 个 角度 来 看 ， 信 息 可 视 化 设计 师 是 在 重复 工程 设计 师 已 经 进行 了 上 
百年 的 工作 。 这 个 活动 中 最 重要 的 一 个 部 分 就 是 设计 师 的 想象 力 。 设 计 同 时 也 是 可 能 涉及 众多 
用 户 的 协作 性 活动 8 。 
| 本 章 将 重点 讨论 5 个 体现 了 设计 本 质 的 优秀 的 信息 可 视 化 工具 。 从 广义 上 来 看 ， 这 些 设计 
所 用 到 的 原则 和 技术 都 来 自 人 机 交互 (human-computer interaction) 领域 。 我 对 每 个 设计 都 做 
了 详细 的 说 明 。 我 没有 选择 将 原文 打印 出 来 的 简单 做 法 ， 而 是 标注 出 重要 的 设计 特色 和 设计 师 
的 成 功 之 处 ， 简 要 介绍 背景 知识 ， 从 而 保持 整 本 书 的 风格 一 致 。 我 经 常 从 原文 中 节选 段落 ， 这 
些 文字 已 经 写 得 非常 清楚 了 ， 因 此 我 认为 没有 必要 重 述 。 所 有 我 介绍 过 的 例子 都 得 到 了 原作 者 
的 许可 。 我 非常 感谢 他 们 同意 我 使 用 原 图 ， 但 读者 应 该 了 解 ， 在 我 认为 能 帮助 理解 的 地 方 ， 我 
使 用 的 是 自己 创建 的 图 片 。 我 特意 在 每 个 案例 分 析 的 最 后 一 个 部 分 附 上 相关 的 参考 文献 。 

熟悉 Spotfire 和 ADVIZOR 的 读者 可 能 会 感到 惊讶 ， 本 章 中 并 没有 介绍 这 些 著名 的 信息 可 视 
化 工具 。 原 因 很 简单 ， 从 前 面 章 节 到 本 章 的 过 渡 存 在 一 个 很 大 的 跳跃 : 从 概念 和 技术 到 为 有 限 
制 条 件 的 特定 任务 所 做 的 设计 。 因 此 ， 对 于 涉及 大 量 语 境 因素 和 需求 的 主流 商业 可 视 化 工具 而 
言 ， 在 本 章 有 限 的 篇 幅 内 对 这 些 设计 所 做 的 肤浅 的 评论 可 能 对 设计 师 不 敬 。 


案例 分 析 


本 章 在 挑选 案例 时 尽量 做 到 覆盖 较为 广泛 的 应 用 环境 。 例 如 ， 前 三 个 例子 分 别针 对 不 同 的 
显示 区 域 ， PDA (6.1 节 )、 传 统 显 示 器 (6.2 节 ) 以 及 手机 (6.3 节 )。 产 品 所 要 支持 的 任务 也 是 
各 不 相同 的 ， 如 在 线 购物 (6.2 节 )、 日 历 (6.1797) 以 及 新 频道 选择 (6.3 节 )。 使 用 到 的 数据 集 
也 是 不 同 的 ， 从军 方 演习 产生 的 通信 数据 (6.4 节 ) 到 新 闻 文 档 集 合 (6.5 节 )。 对 每 一 个 案例 


日 一 个 优秀 的 交互 设计 师 需 要 随时 记 住 两 点 : 第 一 , “你 不 是 用 户 ”， 第 二 , “不 要 尝试 变 成 用 户 ”。 
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都 隐 式 地 强调 了 可 用 性 问题 (关于 这 个 话题 可 以 单独 用 一 本 书 的 篇 幅 来 介绍 ) 。 本 章 的 各 节 依 
次 讨论 以 下 问题 : 
。PDA 日 历 (6.1 节 ) 利用 变形 和 抑制 技术 在 显示 区 域 严重 受 限 的 PDA 上 显示 日 历 。 
。 在 线 购物 (6.2 节 ) 显示 了 超 变量 数据 的 编码 方案 ， 并 且 利用 交互 式 条 形 图 来 实现 对 可 
选 对 象 的 自由 查看 ， 敏 感度 信息 的 使 用 可 以 帮助 实现 “ 先 看 后 走 ”而 非 “ 先 走 后 看 ”的 
策略 。 
。 手 机 屏幕 的 大 小 有 限 ， 这 为 搜索 新 闻 频道 所 需 的 图 片 幻 灯 片 显示 模式 (6.3 节 ) 提供 了 一 
个 很 好 的 实用 环境 。 
。 对 军 方 演习 产生 的 大 量 通 信 数 据 的 探索 式 分 析 (6.4 节 ) 显示 了 属性 浏览 器 作为 其 他 工具 
插件 所 体现 出 的 支持 信息 获取 的 潜力 。 
“在 最 后 一 个 案例 分 析 (6.5 节 ) 中 ，InfoSky 系 统 采 用 了 银河 系 的 隐喻 来 实现 在 大 量 新 闻 
文档 中 的 搜索 和 浏览 功能 。 该 系统 还 体现 了 语义 缩放 和 算法 的 价值 。 


6.1 小 型 交互 式 日 历 
6.1.1 时 间 规 划 


无 论 是 私人 时 间 还 是 工作 时 间 ， 人 们 常常 需要 对 自己 的 时 间 做 很 好 的 规划 。 而 日 历 是 帮助 
人 们 做 时 间 规 划 的 好 帮手 。 我 应 该 在 什么 时 间 预 约 牙医 ? 今年 春天 的 什么 时 候 应 该 去 露营 ? 
CHI 会 议 何 时 举行 ? 日 历 可 以 帮助 我 们 回答 这 些 问 题 。 

大 量 存 储 空 间 和 交互 式 计 算 能 力 的 组 合 使 得 日 历 的 功能 日 益 强 大 ， 而 PDA 一 类 的 手持 设备 
使 得 日 历 的 使 用 变 得 可 移动 和 直接 。 怎 样 实现 的 呢 ? 通常 情况 下 日 历 所 占 空间 都 不 小 ， 特 别 当 
人 们 想 要 查看 一 年 内 的 所 有 记录 时 ，PDA 的 显示 区 域 就 显得 不 够 用 了 。 基 于 已 有 概念 和 技术 ， 
Bederson、Clamage、Czerwinski 和 Robertson 于 2002 年 巧妙 地 、 创 造 性 地 将 日 历 融 入 到 了 PDA 
中 。 他 们 的 系统 最 初 叫 FishCal， 这 个 名 字 反 映 了 其 中 最 重要 的 鱼 眼 显示 模式 ， 现 在 改名 叫 
DateLens, 

设计 师 所 做 出 的 最 重大 的 决定 是 通过 鱼 眼 透镜 概念 将 大 量 的 日 历数 据 显示 在 一 个 较 小 的 显 
示 区 域内 ， 这 正 是 该 工具 最 初 叫 FishCal 的 原因 。 图 6-1 显 示 了 系统 的 主要 界面 。 左 边 显示 的 是 
作为 “总 图 ”的 12 周 数据 〈 例 如 ， 有 预约 的 日 子 ) 。 右 边 显示 了 单 击 4 月 2 日 的 效果 : 除了 该 日 
期 外 的 其 他 日 期 变形 (而 非 移 除 )， 从 而 (同样 是 自动 地 ) 得 到 足够 的 空间 来 显示 所 选 日 期 内 
的 所 有 预约 信息 。 





图 6-1 FishCal 日 历 的 两 个 视图 显示 了 变形 技术 的 使 用 
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6.1.2 设计 哲学 


该 工具 的 设计 者 表示 已 有 知识 对 他 们 的 设计 决定 起 到 了 巨大 的 影响 : 

sisa 这 个 设计 主要 是 基于 很 多 已 有 工作 。 
这 在 复杂 系统 的 设计 过 程 中 是 很 常见 的 。 但 是 他 们 也 强调 了 自身 的 贡献 : 

.虽然 FishCal 的 各 个 特点 都 是 已 有 方法 的 变形 ， 但 是 我 们 的 主要 贡献 在 于 结合 已 有 技 
术 为 重要 的 应 用 领域 创建 一 个 实用 且 新 颖 的 应 用 。 


6.1.3 背景 


我 们 需要 首先 回顾 一 下 支持 交互 式 PDA 日 历 的 前 期 工作 。 

正如 设计 师 们 指出 的 ，FishCal 中 使 用 的 鱼 眼 变形 技术 属于 第 4 章 中 介绍 过 的 双 焦 显示 
(Spence and Apperley, 1982) 。 后 来 ，Furnas 于 1986 年 提出 了 “ 感 兴趣 区 域 ”的 概念 ， 它 利用 
抑制 技术 使 得 重要 数据 可 见 (同样 参见 第 4 章 ) 。FishCal 的 灵魂 在 于 变形 和 抑制 的 结合 。 

图 6-2 显 示 了 Spence 和 Apperley 在 1982 年 首先 提出 的 鱼 眼 日 历 。 他 们 于 1980 年 (在 伦敦 帝 
国 理工 学 院 ) 提出 的 概念 处 于 初级 阶段 ， 虽 然 对 X 和 Z 方 向 的 变形 做 了 探索 ， 但 由 于 当时 的 技 
术 所 限 ， 并 未 实现 成 熟 的 应 用 。 后 来 Furnas 于 1986 年 描述 了 这 样 一 个 想法 : 点 击 某 一 天 可 以 扩 
大 该 日 期 的 显示 区 域 (图 6-3)。 受 当时 技术 的 限制 ， 它 不 支持 图 形 编码 和 搜索 ， 也 没有 控制 显 
示 周 数 的 选项 。 更 重要 的 是 ， 该 设计 并 不 针对 大 小 受 限 的 显示 区 域 。Sutton 和 Spence 于 1988 年 
提出 了 以 下 的 抑制 技术 : 通过 构造 性 盘子 的 隐喻 实现 空间 的 压缩 。 每 个 盘子 包含 某 一 天 的 所 有 
信息 ， 可 以 通过 移动 盘子 来 为 某 一 天 或 数 天 (例如 一 个 星期 ) 提供 足够 的 空间 ( 见 图 6-4)。 





图 6-2 最 早 的 双 焦 日 历 (1980) 


考虑 到 日 历 从 本 质 上 来 说 是 一 系列 表格 的 集合 ， 因 此 应 考虑 使 用 表格 透镜 (Rao and Card, 
1994)。 然 而 ， 该 技术 只 是 为 单个 对 象 而 非 日 历 所 需 的 多 个 对 象 而 设计 的 。 其 他 的 早期 工作 有 
小 显示 区 域内 的 日 历 图 形 编码 (Plaisant and Shneiderman, 1992) 以 及 图 6-5 所 示 的 层 释 式 日 历 
部 件 (Mackinlay er al., 1994)。 后 者 虽然 具有 类 似 鱼 眼 的 效果 ， 但 不 适用 于 小 屏 显 示 设备 。 
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图 6-4 构造 性 日 历 (1988), a) 通过 掩 码 实现 连续 抑制 ，b) 构造 性 日 历 








图 6-5 螺旋 形 日 历 (1994) 
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6.1.4 日 历 视 图 

FishCal 的 设计 师 提 供 了 四 种 日 历 视图 :“ 微 型 "*、“ 议 程 ”"、“ 全 天 ”以 及 “约会 细节 ”( 见 
图 6-6)。 这 些 名 字 反 映 了 各 视图 的 主要 特点 。 例 如 ， 约 会 细节 提供 了 一 天 内 某 个 约会 的 详情 ， 
会 天 是 个 传统 的 显示 一 天 内 所 有 约会 的 视图 ; 会 议 视图 显示 了 排 好 序 的 所 有 约会 的 文字 列表 ， 
在 空间 足够 的 情况 下 还 会 用 较 大 的 字体 来 显示 时 间 。 微 型 视图 显示 了 一 天 内 所 有 约会 的 图 形 视 
图 ， 用 颜色 区 分 不 同类 型 的 约会 。 





最 小 化 最 小 化 最 小 化 
图 6-6 FishCal 日 历 提供 的 四 种 视图 以 及 视图 间 切 换 所 用 到 的 交互 


6.1.5 交互 控制 


视图 间 的 切换 通过 统一 的 交互 实现 (部 分 交互 见 图 6-6) 。 通 过 两 个 按钮 和 语义 缩放 实现 最 
大 化 和 最 小 化 。 受 空间 所 限 ， 从 微型 视图 到 议程 视图 的 转换 通过 点 击 实现 。 

用 户 可 以 通过 移动 图 6-7 中 滚动 条 的 下 方 来 轻松 改变 日 历 所 显示 的 时 间 跨 度 。EFishCal 也 克 
许 直 接 的 用 户 操作 ， 例 如 允许 用 户 单 击 某 一 天 来 聚焦 于 该 天 ， 同 时 减少 其 他 日 期 的 显示 区 域 。 
在 焦点 日 期 (如 图 6-1 左 图 ) 的 背景 上 单 击 可 以 将 该 日 期 放大 到 全 天 视图 。 

该 设计 充分 考虑 到 了 视图 切换 间 的 动画 。 正 如 他 们 指出 的 ， 

[这 些 动画 切换 ] 可 以 提醒 用 户 当前 所 在 的 位 置 。 


6.1.6 搜索 


如 设计 者 评论 的 ， 搜 索 是 很 重要 的 活动 ， 它 可 以 帮助 用 户 找到 大 时 间 跨 度 内 的 模式 和 边界 
对 象 。FishCal 中 的 搜索 将 高 显 所 有 符合 条 件 的 约会 ( 见 图 6-8)。 
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图 6-8 FishCal 的 搜索 结果 


6.1.7 可 用 性 研究 


FishCal 的 设计 师 通过 一 个 实验 来 比较 FishCal 和 微软 的 Pocket PC 2002™ 日 历 。 由 于 缺少 在 
Pocket PC 上 运行 FishCal 所 必需 的 软件 环境 , 因此 两 个 日 历 都 运行 于 配置 了 鼠标 和 键盘 的 PC 上 。 
显示 器 的 分 辩 率 为 1024 x 768, ， 每 个 日 历 均 占据 显示 器 中 央 的 240 x 320 大 小 的 区 域 (相当 于 
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Pocket PC 的 显示 屏 的 尺寸 ) 。 

经 过 精心 挑选 的 6 名 男性 和 5 名 女性 参与 了 实验 。 首 先 通过 辅导 使 参与 者 熟悉 两 个 日 历 ， 在 
辅导 过 程 中 参与 者 分 别 利用 两 个 日 历 完成 11 项 任务 。 对 日 历 的 使 用 顺序 以 及 任务 的 执行 顺序 都 
做 了 平衡 ， 以 减少 训练 效应 以 及 出 现 某 些 任务 比 另 一 些 任务 难 的 概率 。 考 虑 到 用 户 从 日 历 中 发 
现 信息 的 期 待 时 长 ， 每 项 任务 的 完成 时 间 控 制 在 2 分 钟 以 内 ， 和 典型 的 任务 有 : 

。 找 到 某 个 特定 时 间 的 事件 。 

。 查 看 某 个 月 内 有 几 个 星期 一 。 

。 找 出 未 来 三 个 月 内 的 所 有 生日 日 期 。 

。 为 一 个 活动 找到 合适 的 空当 。 


6.1.8 观察 


用 户 感 兴趣 同时 又 能 引起 日 历 设计 师 重视 的 新 日 历 的 特点 有 哪些 ? 一 个 明显 的 性 能 衡量 指 
标 是 任务 完成 时 间 , 另 一 个 指标 是 任务 的 成 功 完成 率 。 比较 主观 的 指标 有 用 户 的 满意 度 和 偏好 。 
为 了 方便 统计 ， 一般 情况 下 会 让 用 户 给 出 数值 评分 (1= 非 常 困难 ，5= 非 常 简单 )。 最 后 ， 在 实 
验 的 进行 过 程 中 总 会 出 现 可 用 性 问题 ， 这 可 以 为 重 设 计 和 后 继 研 究 指明 方向 。 

1. 任务 完成 时 间 

统计 分 析 表 明 使 用 FishCal 的 参与 者 任务 完成 得 较 快 ， 使 用 FishCal 和 使 用 Pocket PC 的 平均 
耗 时 分 别 为 49 秒 和 55.8 秒 ,但 是 差别 并 不 显著 (处 于 临界 值 ， 见 图 6-9)。 随 着 任务 难度 的 增加 ， 
FishCal 在 任务 完成 时 间 上 的 优势 变 得 明显 。 


平均 任务 完成 时 间 


一 中 一 DateLens 
Pocket PC 


平均 时 间 (h) 





图 6-9 两 个 日 历 的 平均 任务 完成 时 间 (DateLens=FishCal) 


2. 任务 成 功 完成 率 

如 图 6-10 所 示 ， 使 用 FishCal 的 任务 完成 率 明显 高 于 Pocket PC (FishCal 的 平均 任务 完成 率 
为 88.2%， 而 Pocket PC 的 为 76.3%)。 由 于 FishCal 人 允许 用 户 将 某 个 时 间 跨 度 内 的 所 有 信息 集中 
在 一 个 视图 中 ， 而 Pocket PC 只 提供 预先 设 定 的 视图 (天 、 周 、 月 以 及 年 )， 因 此 使 用 FishCal 能 
完成 较 多 的 难度 大 且 不 明确 的 任务 。 
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6.1.9 满意 度 和 偏好 


就 整体 而 言 ， 特 别 是 最 困难 的 任务 (任务 11 一 一 未 来 3 个 月 内 有 多 少时 间 冲 突 ? ), 
FishCal 得 到 的 评分 较 高 。FishCal 取 得 的 单 任务 满意 度 比 Pocket PC 高 ， 但 差别 并 不 显著 (处 于 


临界 值 ) 。 





图 6-10 每 个 任务 的 完成 率 ( 蓝 色 =FishCal， 红 色 =Pocket PC) ( 见 彩 图 ) 


6.1.10 可 用 性 


设计 师 得 到 了 参与 者 的 良好 反馈 ， 这 些 意 见 为 重 设计 指明 了 方向 。 例 如 ， 许 多 用 户 不 喜欢 
视图 中 同时 显示 多 于 6 个 月 以 上 的 月 份 ， 整 体 视图 中 只 显示 了 早上 9 点 到 下 午 5 点 的 信息 ， 而 用 
户 希 望 看 到 全 天 24 小 时 内 的 所 有 信息 ， 用 户 对 文字 的 可 读 性 表示 担心 ， 并 且 和 希望 可 以 设置 个 人 
的 默认 视图 :用户 还 希望 可 以 设置 每 周 的 开始 日 期 ( 周 日 或 周一 )。 

实验 中 很 少 可 以 直接 得 出 清晰 的 用 户 偏好 ， 但 对 于 一 个 新 颖 的 界面 ， 可 以 通过 整体 满意 度 
的 调查 表 和 用 户 填写 简报 来 获取 用 户 的 偏好 信息 。 调 查 结果 显示 ， 用 户 略 微 偏 好 Pocket PC 一 
些 ， 但 不 明显 。11 名 参与 者 中 的 6 名 选择 了 Pocket PC 日 历 ，1 名 弃权 的 用 户 表示 理想 的 日 历 应 
结合 这 两 个 日 历 的 优点 ， 另 外 4 名 参与 者 选择 了 FishCal。 偏 好 Pocket PC 的 参与 者 最 常 提 到 的 原 
因 是 他 们 对 Outlook XP 日 历 很 熟悉 。 

针对 创新 性 界面 的 研发 , 实验 结果 揭示 了 未 来 工作 的 几 个 方向 。 虽然 用 户 提出 了 很 多 需求 ， 
但 设计 师 需 要 对 这 些 需求 逐一 检验 ， 判 断 在 不 妨碍 新 手 用 户 使 用 的 前 提 下 这 些 需求 对 用 户 行为 
的 影响 。 虽 然 实验 使 用 的 是 鼠标 和 键盘 ， 但 在 实际 应 用 中 应 考虑 用 户 使 用 的 是 配备 了 笔 和 触摸 
屏 的 手持 设备 。 

对 于 FishCal 这 样 一 个 新 颖 的 界面 ， 设 计 师 的 结论 具有 一 定 的 普遍 性 。 虽 然 他 们 使 用 鱼 眼 
技术 创造 出 了 FishCal 这 样 一 个 相对 于 传统 日 历 界面 而 言 很 具有 竞争 力 的 系统 ， 但 是 他 们 特别 
提 到 ， 由 于 日 历 管理 是 非常 重要 的 活动 ， 许 多 用 户 对 非 传统 界面 持 谨慎 的 态度 ， 因 此 FishCal 
面临 的 一 大 挑战 是 如 何 进行 重 设计 以 满足 更 广泛 用 户 群 的 需求 。 

整体 来 看 ，FishCal ( 现 更 名 为 DateLens) 是 一 个 成 功 的 设计 ， 我 们 相信 Kent Wittenburg 的 
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评论 会 引起 很 多 设计 师 的 共鸣 : 
新 颖 的 可 视 化 系统 很 少 能 获得 首次 使 用 用 户 的 积极 反馈 。 
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6.2 从 多 个 对 象 中 选取 一 个 对 象 
6.2.1 问题 定义 

从 多 个 待 选 项 中 选取 出 一 个 物体 是 常见 的 活动 : 我 们 去 超市 选 购 奶 酷 、 去 商场 买 领带 、 去 
汽车 展厅 选 购 汽车 ， 或 者 由 于 要 搬家 而 去 拜访 房屋 经 纪 人 。 很 长 一 段 时 间 以 来 ， 我 们 进行 这 些 
活动 的 时 候 并 没有 电脑 的 帮助 。 现 在 挑战 在 于 如 何 通 过 电子 技术 来 为 用 户 提 供 备 选 方案 ， 从 而 
帮助 用 户 进行 选择 。 在 本 案例 分 析 中 ， 我 们 将 介绍 Wittenburg 及 其 同事 研发 EZChooser 的 整个 
历程 。 这 是 一 个 根据 属性 从 多 个 对 象 中 选择 一 个 对 象 的 网 络 应 用 。EZChooser 的 成 功 很 大 程度 
上 源 自 第 2 章 中 介绍 的 条 形 图 的 使 用 、 敏 感度 线索 的 提供 、 对 选择 过 程 中 涉及 的 许多 复杂 的 子 
任务 的 判别 ， 以 及 对 整个 对 象 选 择 过 程 中 的 心理 模型 的 重要 性 的 认 知 9。 


6.2.2 任务 
Wittenburg 及 其 同事 我们 应 称 他 们 为 “研发 者 ”) 最 初 的 研究 工作 开始 于 对 所 支持 任务 


日” 该 案例 分 析 中 的 某 些 内 容 和 前 面 章 节 有 所 重复 。 我 们 这 样 做 的 目的 是 想 使 读者 能 够 独立 阅读 该 案例 分 析 。 
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的 精确 定义 (Spence, 2001, p.73): 

假定 给 定 的 对 象 集 中 的 每 个 对 象 表示 为 一 组 属性 ， 任 务 是 找到 一 个 可 接受 的 对 象 或 一 组 什 
得 考虑 的 备 选 项 。 

正如 他 们 指出 的 ， 从 投资 决策 到 同事 、 双 程 旅行 以 及 不 动产 的 选择 ， 这 个 任务 有 着 很 广泛 
的 应 用 范围 。 

很 长 时 间 以 来 ， 数 据 库 查 询 都 遵循 着 严格 的 流程 ， 但 很 多 研究 者 已 经 认识 到 了 这 些 传统 技 
术 的 不 足 之 处 。 正 如 研发 者 评论 的 : 

很 多 情况 下 查询 结果 为 空 ， 这 将 导致 后 续 工 作 变 得 复杂 。 很 多 查询 场景 中 的 一 个 基本 问题 
是 ,用户 在 实施 查询 前 并 不 清楚 自己 要 找 的 是 什么 。 正确 的 选择 决策 取决 于 可 供 选 择 的 选项 集 、 
对 各 选项 的 比较 以 及 多 个 维度 (属性 ) 上 的 交互 。 根 据 了 解 到 的 知识 ， 用 户 可 能 做 出 临时 的 反 
应 (Suchman, 1987) 。 对 于 能 揭示 预料 之 外 解决 方案 的 心理 模型 的 建立 ， 传 统 的 查询 方式 提供 
的 路 线 是 非 直接 而 且 麻 类 的。 例如， 在 购车 实例 中 ， 如 果 用 户 发 现 了 比 事先 设想 的 更 好 的 担保 
或 汽油 消耗 定额 指标 ， 他 们 也 许 会 愿意 提高 最 初 设 定 的 预算 。 而 传统 的 查询 方式 并 不 能 帮助 用 
户 轻 松 地 发 现 这 样 的 信息 。 

研发 者 的 评论 很 好 地 反映 了 他 们 的 文章 标题 中 “ 探 察 ”的 精神 。 令 人 失望 的 是 ， 现 有 很 多 
在 线 服务 系统 并 没有 重视 这 个 因素 。 


6.2.3 已 有 解决 方案 


在 EZChooser 出 现 之 前 ， 已 经 有 很 多 旨 在 克服 传统 技术 缺陷 的 设计 涌现 。 例 如 ，tables 使 用 
了 人 们 熟悉 的 数据 格式 ， 因 此 很 适合 于 对 通过 “削减 法 ”得 到 的 较 少 选项 的 考察 。EZChooser 
的 研发 者 专门 对 tables 和 EZChooser 做 了 对 比 。Gnuides 系 统 通 过 问 一 系列 问题 来 帮助 用 户 进行 对 
象 选 择 ， 但 它 的 一 大 缺点 在 于 用 户 无 法 预料 跟随 某 个 特定 路 径 的 结果 。 例 如 ， 在 旅行 实例 中 ， 
在 了 解 相应 的 机 票 价格 前 ， 用 户 可 能 不 愿意 选 定 启 程 和 回程 时 间 。 最 新 的 基于 代理 的 推荐 系统 
(agent-based recommender system) 根据 手机 用 户 的 偏好 信息 提供 相应 的 “解决 方案 ”"。 但 是 ， 
用 户 可 能 会 产生 一 种 不 好 的 情绪 : 如 果 对 方案 的 产生 过 程 有 足够 多 的 了 解 ， 也 许 他 们 自己 就 能 
提出 比 系统 更 优 的 方案 。 

研发 者 对 动态 查询 和 属性 浏览 器 这 两 种 帮助 用 户 建立 决策 空间 认 知 模型 的 可 视 化 技术 进行 
了 详细 讨论 。 

动态 查询 方法 由 Shneiderman 及 其 同事 在 1992 年 提出 ， 图 6-11 所 示 的 是 一 个 基于 动态 查询 
的 “房屋 查询 ”界面 。 用 户 可 以 通过 调节 右边 的 属性 范围 来 设 定 属性 的 上 下 限 。 左 图 中 的 点 代 
表 满 足 所 有 限制 条 件 的 房屋 。 可 以 手动 修改 限制 条 件 ， 左 图 中 的 显示 会 随 之 即时 更 新 ， 因 此 该 
界面 叫做 动态 查询 。 我 们 在 第 3 章 中 介绍 过 属性 浏览 器 (Spence and Tweedie, 1998), ， 因 此 在 
这 里 不 再 歼 述 。 在 结合 这 两 种 技术 的 问题 上 ， 研 发 者 和 Kirsch (1997) 的 观点 一 致 ， 系统 应 允 
许 用 户 修改 问题 参数 ， 电 子 购 物 系统 应 “人 允许” 用户 进行 参数 选择 的 “娱乐 活动 "。 近 年 来 ， 
出 现 了 很 多 支持 多 参数 对 象 的 灵活 查看 的 例子 ， 例 如 (Yi etal., 2005), 
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图 6-11 动态 查询 ， 一 个 住房 查询 实例 ， 满 足 用户 设 置 的 属性 限制 条 件 的 住房 显示 在 地 图 上 





6.2.4 条 形 图 


研发 者 最 重要 的 设计 决定 就 是 条 形 图 的 引入 。 将 图 6-12a 所 示 的 二 维 条 形 图 中 的 每 个 条 形 
首尾 相连 并 忽略 任何 空缺 值 的 情况 ， 就 可 以 得 到 图 6-12b 所 示 的 一 维 条 形 图 。 对 应 于 二 维 条 形 
图 里 每 个 条 形 的 高 度 ， 对 象 数目 在 一 维 条 形 图 里 表示 为 条 形 的 宽度 。 条 形 图 具有 以 下 特性 : 

1) 传递 的 数值 分 布 信息 较 少 。 例 如 ， 没 有 显示 空缺 数值 和 奇异 值 。 

2) 没有 说 明 条 形 图 里 相 邻 对 象 的 值 是 否 也 相 邻 。 

3) 具有 普遍 性 : 可 以 用 于 表示 数值 型 (数据 、 文 字 ) 、 顺 序 型 或 类 别 型 数据 。 

4) 可 以 同时 使 用 多 个 条 形 图 来 表示 多 个 属性 。 

5) 简单 。 

6) 占用 空间 较 小 。 

第 3) ~6) 条 优势 弥补 了 第 1) ~2) 条 的 不 足 之 处 。 


6.2.5 预示 


研发 者 对 条 形 图 所 提供 的 预示 进行 了 研究 。 在 实际 应 用 中 用 户 可 能 会 对 多 个 属性 感 兴趣 。 
因此 ， 平 行 条 形 图 (parallel bargram， 相 应 论文 的 标题 强调 了 该 方法 的 重要 性 ) 更 为 适用 ( 见 
图 6-12c) 。 由 于 每 个 对 象 只 在 每 个 条 形 图 中 出 现 一 次 ， 因 此 可 以 使 用 扫 光 来 支持 多 属性 信息 的 
探索 。 每 个 条 形 的 宽度 对 应 于 该 范围 内 的 对 象 数目 ， 因 此 研发 者 为 每 个 条 形 图 设置 了 一 个 对 象 
向 量 〈 见 图 6-12d) 。 向 量 中 的 图 标 可 以 根据 具体 应 用 领域 进行 设 定 。 在 条 形 图 上 方 显示 的 对 象 
图 标 可 以 为 条 形 图 加 上 标签 〈 如 汽车 实例 中 的 MPG 和 价格 ) 。 通 过 对 象 图 标的 选择 ， 用 户 可 以 
执行 交互 式 的 查询 (图 6-12e) 。 查 询 结果 可 以 反馈 在 对 象 向 量 上 ， 从 而 向 用 户 展示 满足 所 有 属 
性 设置 条 件 的 对 象 。 


6.2.6 EZChooser 


通过 对 平行 条 形 图 的 优点 和 预示 特点 进行 分 析 ， 研 发 者 创造 了 EZChooser 的 界面 。 图 6-13 
是 一 个 汽车 购买 实例 。 可 以 看 到 其 中 对 平行 条 形 图 的 最 大 改进 在 于 显示 方式 :屏幕 下 方 显示 了 
23 辆 汽车 的 图 片 ， 用 户 选中 了 其 中 一 辆 。 汽 车 外 观 是 很 重要 的 属性 ， 但 它 是 不 可 量化 的 ， 这 对 
基于 数值 型 、 顺 序 型 和 类 别 型 数据 的 传统 查询 系统 提出 了 一 个 很 大 的 考验 。 由 于 每 个 属性 行 
(包括 条 形 图 和 对 象 向 量 ) 具有 最 小 高 度 限制 ， 为 了 在 有 限 区 域内 显示 多 个 属性 ， 图 6-13 中 使 
用 了 滚动 条 。 
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a) 直方 图 


b) 条 形 图 


c) 两 个 属性 对 应 的 条 形 图 显示 了 对 象 的 分 
布 情况 。 同 一 对 象 在 两 个 条 形 图 中 的 位 
置 通过 高 显 显示 


d) 对 象 显示 在 每 个 条 形 图 上 方 的 对 象 向 量 
内 ， 通 过 这 样 的 方式 为 条 形 图 加 上 标签 


e) 用 户 可 以 通过 单 击 选中 条 形 ， 选 择 结果 
会 同时 反馈 在 对 象 向 量 上 


图 6-12 条 形 图 、 平 行 条 形 图 和 对 象 向 量 的 设计 
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图 6-13 EZChooser 界 面 截图 ( 见 彩 图 ) 
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EZChooser 中 显示 的 数据 有 很 多 种 查看 方法 (我 们 已 经 在 第 2 章 中 介绍 过 其 中 - - 些 了 ), 这 
正 是 EZChooser 的 优点 之 一 。 例 如 ， 可 以 在 图 片 集中 通过 扫 光 选中 一 辆 汽车 (系统 自动 为 该 汽 
车 图 片 加 上 黄色 边框 ， 见 图 6-13) ， 对 应 条 形 图 中 的 对 象 图 标 也 得 到 高 显 。 很 明显 的 ， 和 其 他 
车 相 比 ， 图 6-13 中 选中 的 汽车 耗 油 量 大 ， 价 格 处 于 中 高 等 价位 。 在 对 象 向 量 中 选择 某 个 对 象 
图 标 也 可 以 实现 相同 的 扫 光 效果 。 用 户 可 能 会 想 要 设置 一 些 属性 条 件 用 以 查看 满足 这 些 条 件 
的 汽车 数目 、 外 观 以 及 它们 不 满足 的 其 他 属性 条 件 。 用 户 可 以 点 击 条 形 图 的 任意 多 个 条 形 来 
设置 一 系列 属性 条 件 。 同 一 个 条 形 图 内 选中 的 条 形 之 间 是 “或 ”的 关系 ， 而 不 同 的 条 形 图 之 
间 是 “与 ”的 关系 。 

EZChooser 的 另 一 个 特点 是 通过 保持 高 显效 果 的 “ 黏 性 ”来 提供 记忆 线索 。 我 们 经 常 在 有 
了 一 个 大 概 的 结论 后 就 想 用 某 种 方式 对 其 进行 “标注 "， 这 样 以 后 可 以 较为 容易 地 返回 来 ， 同 
时 还 可 以 将 其 作为 比较 的 基础 。 实 际 上 ， 可 以 从 某 个 特定 汽车 的 对 应 网 页 进入 EZChooser， 即 
用 户 可 以 从 细节 晨 次 的 实例 着 手 ， 而 后 进入 总 图 层次 。 这 个 特点 是 非常 重要 的 ， 它 不 仅 支 持 一 
个 特别 的 探 察 模式 ， 而 且 强 调 了 “总 图 优先 ， 然 后 根据 需求 显示 细节 ”(Shneiderman， 1996) 
并 不 是 数据 集 探 察 的 唯一 模式 。 


6.2.7 敏感 度 


图 6-14 显 示 了 针对 具体 应 用 领域 而 设计 的 图 标 。 用 户 可 以 通过 点 击 条 形 来 设置 属性 条 件 ， 
满足 所 有 需求 的 汽车 在 所 有 对 象 向 量 中 表示 为 完全 图 标 (full glyph) 。 前 面 提 到 过 ， 鼠 标 悬 停 
在 这 些 图 标 上 可 以 看 到 对 应 对 象 在 所 有 对 象 向 量 中 的 位 置 。 所 有 完全 图 标 对 应 的 汽车 显示 在 屏 
幕 下 方 。 当 完全 图 标 出 现在 没有 被 选中 的 条 形 上 方 时 ， 说 明 如 果 该 条 形 被 选中 ， 条 件 设 置 将 变 
得 更 为 严格 ， 但 满足 条 件 的 集合 将 不 为 空 。 边 界 图 标 (outline glyph) 表示 不 满足 所 有 条 件 的 
对 象 ， 但 如 果 该 图 标 下 方 的 条 形 被 选中 ， 它 将 变 为 完全 图 标 。 如 果 没 有 任何 图 标 则 说 明 其 他 限 
制 条 件 已 经 将 该 对 象 排除 在 外 了 。 这 些 图 标 是 EZChooser 的 一 个 重要 特点 ， 但 是 很 遗憾 ， 现 在 
很 多 网 站 并 不 支持 这 项 功能 。 这 种 基于 图 标的 信息 编码 方式 重 现 了 第 5 章 中 讨论 过 的 敏感 度 线 
索 。 条 形 表示 了 SI 编码 ， 而 图 标 和 加 了 标签 的 条 形 一 起 构成 了 SM 编码 。 


填充 图 标 表示 满足 所 有 条 件 的 对 象 C] aa 


在 未 选中 条 形 上 方 的 填充 图 标 表 示 如 
果 该 条 形 被 选中 ， 条 件 设置 将 变 得 更 


@ 
为 严格 ， 但 满足 条 件 的 集合 将 不 为 空 |, ANS, 


边界 图 标 ， 用 户 选中 下 方 的 条 形 ， 将 
把 对 应 对 象 加 入 备 选 集合 | | 
条 形 上 方 没有 图 标 则 说 明 其 他 限制 条 
件 已 经 将 对 应 的 对 象 排除 在 外 了 || CJL] 


图 6-14 各 种 图 标 状态 以 及 提供 的 信息 
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图 6-15 是 上 述 图 标 编码 方案 的 一 个 示例 。 用 户 已 经 选择 了 3 个 用 户 向 导 推 荐 值 (第 2 行 )， 
并 且 设 置 了 一 个 价格 区 间 (第 4 行 )。 满 足 这 些 限制 条 件 的 4 辆 汽车 显示 在 屏幕 下 方 ， 它 们 对 应 
的 属性 值 显示 为 每 行 中 的 填充 图 标 。 点 击 第 2 行 和 第 4 行 中 边界 图 标 下 方 的 条 形 可 以 将 相应 对 象 
加 入 备 选集 合 。 
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图 6-15 在 EZChooser 中 进行 的 查询 。 用 户 已 经 设置 了 一 些 限制 条 件 。 每 行 中 的 图 标 表 示 了 属性 值 
之 间 的 关系 并 为 加 强 限制 条 件 提供 了 线索 


6.2.8 相关 工作 


在 完成 了 EZChooser 的 设计 后 ， 研 发 者 将 它 和 其 他 “查询 系统 ”做 了 比较 ， 虽 然 这 个 词 不 
能 完全 反映 EZChooser 界 面 所 提供 的 探 察 功能 和 潜在 信息 启示 。 

MultiNav (Lanning et al., 2000) 是 现 有 基于 条 形 图 的 两 个 系统 之 一 ， 它 的 第 一 个 原型 如 
图 6-16 所 示 。 我 们 可 以 看 到 拥有 3 个 属性 的 27 台 电视 。 用 户 通过 点 击 选择 了 B 厂 商 ， 该 厂商 生 
产 的 5 台电 视 在 所 有 属性 行 上 得 到 高 显 。 图 6-17 显 示 了 第 二 个 原型 ， 它 支持 相同 的 交互 ， 并 且 
每 行 都 可 以 在 水 平方 向 上 移动 。 图 中 显示 ， 用 户 将 价格 条 形 向 左 移 动 了 一 点 ， 使 得 一 台 价 格 刚 
好 在 400 美 元 以 下 的 电视 位 于 显示 区 域 正中 。 其 他 行 也 做 了 相应 的 移动 使 得 该 电视 (B 厂 商 生 
产 的 一 台 19 寸 电视 ) 在 其 他 条 形 中 的 位 置 和 价格 条 形 中 的 位 置 对 齐 。 该 电视 及 细节 信息 显示 在 
屏幕 下 方 。MultiNav 的 优点 在 于 用 户 可 以 观察 属性 闻 的 相关 性 ， 并 且 通 过 观察 属性 条 形 的 移动 
方向 来 改变 它们 的 关联 性 。 但 是 ， 这 个 系统 最 显著 的 不 足 在 于 没有 提供 任何 的 敏感 度 信息 ， 因 
此 用 户 很 难 发 现 一 些 事 实 ， 例 如 ， 如 果 预 算 提 高 15 美 元 就 能 选择 一 台大 一 点 的 电视 。 

EZChooser 研 发 者 的 同事 们 原本 计划 将 MultiNav 改 造成 电子 商务 应 用 系统 ， 因 此 对 它 进行 
了 一 系列 的 用 户 测 试 。 然 而 测试 结果 显示 MultiNav 存 在 着 两 个 可 用 性 问题 ， 由 此 激发 了 他 们 对 
EZChooser 的 开发 兴趣 。MultiNav 的 第 一 个 可 用 性 问题 在 于 属性 行 的 滑动 操作 实际 上 是 不 常用 
而 且 容易 引起 错误 的 ， 相 对 于 普通 用 户 ， 它 可 能 更 适用 于 专家 用 户 。 同 样 的 问题 也 存在 于 邻近 
区 域 浏览 器 (Neighbourhood Explorer, Apperley et al., 2000; Spence, 2001) 中 。 当 用 户 设置 了 
一 个 限制 条 件 (如 B 厂 商 ) 时 ，MultiNav 的 第 二 个 可 用 性 问题 出 现 了 : 用 户 希 望 在 屏幕 下 方 看 
到 的 不 是 唯一 的 焦点 对 象 ， 而 是 满足 这 个 限制 条 件 的 所 有 对 象 。 虽 然 邻 近 区 域 浏览 器 中 使 用 了 
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MultiNav 技 术 ， 但 是 EZChooser 的 研发 者 还 是 决定 使 用 鼠标 按钮 这 样 用 户 熟悉 的 交互 方式 。 
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图 6-16 MultiNav 的 第 一 个 原型 。 用 户 选择 了 B 厂 商 ， 该 厂商 生产 的 所 有 产品 在 所 有 属性 行 上 得 到 高 显 
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图 6-17 MultiNav 的 第 二 个 原型 。 用 户 将 价格 条 形 向 左 移 动 了 一 点 ， 使 得 一 台 价 格 刚好 在 400 美 元 
以 下 的 电视 位 于 显示 区 域 正中 


InfoZoom (Lindner, 2000) 是 支持 和 EZChooser 同 样 功能 的 另 一 个 系统 。 针 对 大 型 和 小 型 
的 数据 集 ， 它 分 别 使 用 平行 条 形 图 和 焦点 + 上 下 文 的 方法 。 它 支持 简单 的 选择 和 过 滤 功 能 ( 例 
如 ， 对 对 象 集合 的 抑制 )。 鉴 于 该 系统 本 身 的 优势 ， 它 没有 使 用 对 象 向 量 、 敏 感度 信息 和 对 象 
标注 。 

研发 者 以 “动态 直方 图 ”为 题 对 以 上 系统 进行 了 细致 的 讨论 ， 他 们 认为 应 该 将 对 象 向 量 和 
条 形 图 相 结合 。 感 兴趣 的 读者 可 以 参见 原文 (Wittenburg et al., 2001, p.57)。 


6.2.9 评估 


研发 者 将 EZChooser 和 含有 相同 数据 的 简单 表格 进行 了 对 比 。 实 验 结果 证 实 了 以 下 假设 : 
“ 当 数 据 集 较 大 时 ， 用 户 倾 向 于 使 用 EZChooser， 并 且 他 们 喜欢 使 用 EZChooser”。 而 另 一 个 假 
设 “ 当 数据 集 较 小 时 ， 用 户 倾向 于 使 用 静态 表格 ” 则 未 得 到 证 实 。 研 究 者 指出 ， 他 们 的 实验 
只 使 用 了 两 个 大 小 分 别 为 3 和 50 的 数据 集 ， 因 此 还 需要 对 和 数据 集 大 小 相关 的 因素 进行 进一步 
的 研究 。 他 们 强调 这 些 结 果 是 初步 的 ， 并 为 所 有 新 颖 界面 设计 师 做 了 如 下 有 趣 且 鼓舞 人 心 的 
评论 : 
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6.2.10 评论 


研发 者 创造 了 EZChooser 来 支持 从 多 个 对 象 中 选择 一 个 对 象 的 任务 。 它 支持 灵活 的 排序 、 
发 现 和 娱乐 ， 反 映 了 支持 该 任务 所 应 遵循 的 步骤 。EZChooser 使 用 了 最 简单 的 按钮 点 击 ， 结 合 
了 条 形 图 和 对 象 向 量 ， 更 为 重要 的 是 ， 它 提供 了 支持 定位 的 敏感 度 信息 。 
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6.3 基于 锁 眼 的 网 页 浏览 


6.3.1 寻找 新 闻 


“追踪 热点 新 闻 ” 是 我 们 熟悉 的 日 常 活动 之 一 ， 我 们 通常 通过 访问 许多 新 闻 频 道 来 实现 新 
闻 的 实时 更 新 。 然 而 ， 随 着 手机 和 PDA 的 普及 ， 人 们 越 来 越 习 惯 于 在 手持 移动 设备 上 读 新 闻 ， 
从 而 摆脱 地 点 的 限制 。 但 是 这 些 设备 上 的 显示 区 域 比 传统 的 显示 器 小 很 多 ， 这 就 为 系统 设计 带 
来 了 很 多 挑战 。 以 下 的 案例 分 析 将 展示 这 些 设计 挑战 ， 一 个 用 户 想 在 PDA 上 快速 评估 10 条 或 
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者 20 条 新 闻 ， 从 中 迅速 选择 出 最 感 兴趣 的 一 条 。 
6.3.2 问题 定义 


图 6-18 显 示 的 是 在 普通 大 小 的 传统 显示 器 上 的 一 个 新 闻 网 页 ， 里 面 有 各 种 新 闻 内 容 。 我 们 
将 图 片 及 其 带 链接 的 简介 文字 称 做 “链接 预览 ”(link preview)。 在 没有 交互 的 情况 下 (例如 
第 5 章 中 介绍 的 “被 动 式 交互 ”)， 用 户 可 以 仔细 阅读 这 些 内 容 ， 然 后 从 中 选择 感 兴趣 的 对 象 。 
在 不 使 用 某 些 交互 的 前 提 下 ， 用 户 在 使 用 显示 区 域 小 得 多 的 PDA 上 无 法 阅读 整个 网 页 的 内 容 ， 
因此 相同 的 评估 行为 以 及 气味 的 形成 是 不 可 能 实现 的 。 
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图 6-18 一 个 典型 的 新 闻 网 页 ， 黑色 边框 内 是 链接 预览 


一 种 解决 办 法 是 保持 页 面 内 容 不 变 ， 而 通过 滚动 来 阅读 网 页 的 各 个 部 分 。 但 是 要 查看 完整 
个 网 页 的 所 有 内 容 以 及 定位 线索 (第 5 章 中 已 经 介绍 过 了 SM 和 SI) 需要 耗费 很 多 的 时 间 ， 这 是 
实际 应 用 中 所 不 允许 的 。 另 一 方面 ， 为 了 进行 繁琐 的 滚动 操作 ， 用 户 不 得 不 记 住 已 看 过 部 分 的 
内 容 和 线索 。 

另 一 种 解决 办 法 是 用 简单 的 文字 链接 取代 所 有 或 大 部 分 的 图 片 内 容 ， 从 而 避免 滚动 操作 
( 见 图 6-19)。 不 幸 的 是 ， 图 片 或 图 标 常 常 提供 了 很 多 的 定位 线索 ， 取 消 这 些 内 容 将 严重 降低 用 
户 构建 气味 的 能 力 ， 从 而 不 能 有 效 地 确定 感 兴趣 的 对 象 。 

毫 无 意外 的 ， 很 多 研究 者 (Woodruff et al., 2001; Cockburn et al., 1999; Ayers and Stasko, 
1995) 致力 于 用 缩 略 图 (目标 页 面 的 小 型 拷贝 ) 来 表示 超 链接 (如 SM 和 SI)。 缩 略图 可 以 提供 
强大 的 定位 线索 。 但 是 Kaasten 等 (2002) 指出 ， 要 想 使 用 缩 略 图 ， 必 须 将 很 大 一 部 分 显示 区 
域 分 配给 缩 略 图 ， 但 是 手机 和 PDA 上 并 没有 足够 的 显示 区 域 。 
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图 6-19 用 菜单 替代 图 片 内 容 可 以 避免 滚动 


6.3.3 解决 方案 


为 了 克服 显示 区 域 小 的 局 限 性 ， 同 时 保留 设计 良好 的 图 片 所 带 来 的 强大 的 定位 线索 ，de 
Bruijn 和 Tong (2003) 提出 了 快速 序列 视觉 表示 (RSVP) 的 概念 ( 详 见 4.2 节 ); 顺序 地 显示 
链接 预览 集合 中 的 每 一 个 链接 预览 ( 见 图 6-20)， 而 不 是 一 次 性 显示 所 有 链接 预览 。 利 用 RSVP 
概念 ， 每 个 链接 预览 可 以 顺序 占据 整个 显示 区 域 。 同 传统 网 页 一 样 ( 见 图 6-18)， 顺 序 显 示 的 
页 面 中 的 图 片 和 简介 文字 占据 大 致 相同 的 空间 。 这 个 设计 决策 是 本 案例 分 析 中 最 主要 的 决定 。 


显示 边框 






链接 预览 1 
Rid Tet 
ES: 


图 6-20 链接 预览 的 顺序 表示 ， 每 个 链接 预览 依次 占据 整个 显示 区 域 


在 决定 将 链接 预览 顺序 而 非 同 时 地 显示 后 ， 研 究 者 仍 面临 很 多 问题 ， 特 别 是 由 有 限 显 示 区 
域 产 生 的 问题 。 虽 然 顺序 显示 的 链接 预览 提供 了 有 用 的 定位 线索 ， 但 是 还 存在 一 些 定位 和 交互 
方面 的 问题 。 

本 案例 分 析 建 立 在 如 下 情景 中 : 用 户 可 能 想 看 看 网 页 上 有 哪些 新 闻 ， 也 可 能 想 看 看 哪些 新 
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闻 频 道上 有 他 感 兴趣 的 某 个 话题 。 
6.3.4 _ RSVP 浏览 器 


图 6-21 所 示 的 是 一 个 叫做 RSVP 浏 览 器 的 实验 性 系统 。 它 提供 了 两 层 菜单 系统 ， 每 层 中 的 
可 选项 用 幻灯 片 RSVP 模 式 (而 非 静态 模式 ) 加 以 描述 。 因 此 ， 所 有 新 闻 对 象 都 表示 为 两 个 链 
接 预 览 。 图 6-22 显 示 了 一 个 链接 预览 及 其 对 应 的 新 闻 对 象 。 实 际 上 ， 链 接 预 览 的 设计 和 大 型 显 
示 区 域 中 的 新 闻 对 象 的 描述 相差 无 几 。 只 要 用 户 使 用 的 是 视觉 处 理 系统 ， 图 6-21 所 示 的 链接 预 
览 顺 序 显示 的 效果 就 和 用 户 扫描 图 6-18 所 示 的 大 型 页 面 而 在 视网膜 四 点 上 留 下 的 连续 图 片 非 常 
类 似 。 我 们 可 以 认为 顺序 表示 可 以 让 用 户 免 于 视觉 凝视 策略 的 制定 ， 从 而 可 以 将 更 多 的 时 间 花 
在 每 个 新 闻 对 象 的 解释 上 。 正 如 de Bruijn 指 出 的 : 

ps 阅读 内 容 和 跟踪 链接 是 两 个 可 以 有 效 分 离 的 活动 。 

用 户 首先 看 到 的 是 标题 为 “ITV 新 闻 ” 的 静态 视图 。 通 过 命令 触发 第 一 层 上 的 链接 预览 的 
幻灯 片 显示 模式 。 同 样 的 显示 方式 循环 出 现 直 至 用 户 停留 在 某 链接 预览 上 〈 见 图 6-21 中 的 B) 。 
随后 进入 第 二 层 显 示 ， 幻 灯 片 模式 同样 持续 直至 用 户 选 中 某 个 新 闻 对 象 《图 6-21 中 的 B2)。 使 
用 命令 可 以 实现 该 新 闻 对 象 的 阅读 ， 当 对 象 超过 一 页 时 ， 系 统 支持 翻 页 。 
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图 6-21 RSVP 浏 览 器 示意 图 。 和 MA 
用 户 选中 某 个 对 象 。 图 标 显示 该 交互 需要 按 下 PDA 的 主 控 按 钮 。 图 6-24 显 示 了 交互 效果 
的 细节 
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图 6-22 a) 链接 预览 模式 ，b) 某 个 新 闻 故 事 的 页 面 浏览 模式 。 该 故事 可 以 超过 一 页 (图 片 感谢 
Oscar de Bruijn 和 Chieh Hao Tong 惠 允 ) 


6.3.5 系统 设计 


每 个 链接 预览 应 显示 的 时 长 是 研究 者 关心 的 主要 问题 。 如 果 时 长 太 短 ， 用 户 可 能 没有 足够 
的 时 间 对 链接 预览 进行 解释 ， 但 时 长 太 长 也 是 用 户 所 不 愿意 看 到 的 。 根 据 用 户 偏好 ， 研 究 者 最 
终 选 定 的 显示 时 长 为 半 秘 。 

虽然 链接 预览 可 以 提供 强大 的 定位 线索 ， 研 究 者 还 是 引入 了 其 他 增强 定位 的 技术 。 首 先 ， 
图 6-23 中 右边 链接 条 中 的 每 个 小 方块 代表 一 个 链接 ， 它 们 实现 了 “万 能 可 见 性 ”(universe 
visibility) 。 为 了 标明 当前 显示 的 链接 预览 在 链接 预览 序列 中 的 位 置 ， 对 应 的 小 方块 得 到 高 显 ， 
用 户 可 以 随时 暂停 并 选择 另外 的 链接 预览 。 链 接 预览 可 以 帮助 用 户 回答 “我 从 当前 位 置 可 以 去 
哪里 ”的 问题 。 研 究 者 同时 也 意识 到 了 Tauscher 和 Greenberg (1997) 的 发 现 ; 已 采取 活动 的 
历史 信息 可 以 为 用 户 提 供 强大 的 定位 支持 。 在 RSVP 浏 览 器 中 ， 这 类 信息 显示 在 “历史 记录 条 ” 
(图 6-23) 中 ， 其 中 的 小 方块 表示 已 访问 过 的 页 面 。 信 息 条 同样 也 提供 了 有 用 的 定位 信息 : 在 
链接 预览 模式 中 ， 条 状 代表 当前 显示 的 链接 预览 在 整个 序列 中 的 位 置 ， 在 页 面 模式 中 ， 条 状 代 
表 当 前 显示 的 页 面 在 构成 某 个 新 闻 对 象 的 所 有 页 序列 中 的 位 置 。 


主要 视图 区 域 


链接 条 





历史 记录 条 KAN 


图 6-23 用 作 定 位 支持 的 链接 条 、 历 史记 录 条 和 信息 条 (图 片 感谢 Oscar de Bruijn 和 Chieh Hao Tongi ft) 
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研究 者 使 用 了 PDA 上 的 控制 按钮 (图 6-24) 来 研究 单 手 用 户 交互 在 RSVP 浏 览 器 中 的 实现 。 
在 系统 的 最 终 版 本 中 使 用 了 PDA 底 部 的 四 个 方向 控制 键 ， 从 而 避免 了 触 控 笔 交互 带 来 的 问题 
在 触摸 屏幕 时 ， 如 果 需 要 保证 精度 则 必须 使 用 双手 交互 。 
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图 6-24 RSVP 浏 览 器 的 定位 控制 


6.3.6 评估 


研究 者 将 RSVP 浏 览 器 和 微软 的 Internet Explorer 的 便携 版 本 (Pocket IE) 做 了 比较 测试 ， 
两 个 系统 均 在 Compaq IPAQ PDA 上 运行 。30 名 人 员 参 与 了 实验 ， 他 们 被 要 求 从 5 个 新 闻 对 象 中 
获取 信息 。 通 过 和 相同 条 件 下 大 家 熟悉 的 浏览 器 的 比较 ， 研究 者 对 基于 手持 设备 的 RSVP 交 互 
模式 进行 了 测试 。 

研究 者 随机 选中 参与 者 中 的 15 名 来 使 用 RSVP 浏 览 器 ， 另 外 15 名 使 用 Pocket IE。 为 参与 者 
分 配 的 任务 尽量 保证 实际 性 以 及 设备 无 关 性 。 每 个 参与 者 被 要 求 回 答 8 个 问题 ， 以 下 是 一 个 典 
型 的 问题 : 

由 于 铁路 附近 发 生 了 一 系列 的 爆炸 ，Belfast 和 Dublin 之 间 的 火车 交通 被 关闭 了 。 爆 炸 的 原 
因 找 到 了 吗 ? 

[答案 : 没有 ] 

图 6-25 显 示 了 评估 的 所 有 步骤 。 首 先 ， 没 有 为 参与 者 提供 RSVP 浏 览 器 和 Pocket IE 的 使 用 
说 明 。 这 使 得 研究 者 可 以 观察 新 的 操作 模式 以 及 用 户 在 执行 8 个 任务 前 后 的 行为 对 比 。 在 回答 
第 2 一 6 个 问题 时 ， 参 与 者 可 以 向 研究 者 求助 。 在 回答 第 1 个 和 最 后 2 个 问题 时 ， 参 与 者 不 能 
提问 。 这 种 方法 (Moyes and Jordan, 1993) 带 来 了 一 些 有 趣 的 启示 。 视 频 记录 下 了 参与 者 
的 所 有 动作 以 方便 对 用 户 交 互 的 后 续 评估 。 我 们 首先 讨论 对 用 户 行为 的 度量 ， 然 后 讨论 用 
户 喜好 。 
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图 6-25 在 RSVP 浏 览 器 评估 过 程 中 为 参与 者 提供 的 帮助 


1. 用 时 
毫 无 意外 的 ， 由 于 不 熟悉 RSVP 浏 览 器 ， 用 户 回答 第 1 个 问题 时 所 花费 的 平均 时 间 是 传统 IE 
的 5 倍 ( 见 图 6-26)。 但 是 ， 这 两 个 系统 在 接 下 来 的 6 个 任务 中 的 完成 时 间 没 有 明显 的 差别 。 213 
120 ] 100 
_ 100 
= 80 ORSVP 浏览 器 
si. Pocket IE 
X 40 22 24 24 25 25 |mPock 
£ 20 
i 
0 
1 7 8 
问题 
图 6-26 分 别 利用 RSVP 浏 览 器 和 Pocket IE 回答 第 1、7、8& 个 问题 所 耗费 的 平均 时 长 ( 取 整 到 最 近 
的 秒 数 ) 
2. 操作 数 


图 6-27 显 示 了 回答 第 1、7、8 个 问题 的 过 程 中 用 户 采 取 的 不 必要 的 操作 数目 。 一 个 典型 的 
不 必要 操作 是 选择 了 不 正确 的 链接 预览 。 竖 直方 向 上 的 条 形 表示 不 必要 操作 的 数目 /最 少 操作 
数目 。 我 们 再 次 看 到 ， 随 着 在 前 几 个 任务 中 对 系统 的 熟悉 度 的 增加 ，RSVP 浏 览 器 和 Pocket IE 
在 不 必要 的 操作 数目 方面 没有 明显 差别 。 
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图 6-27 分 别 使 用 RSVP 浏 览 器 和 Pocket IE 来 回答 第 1、7、8 个 问题 的 过 程 中 采取 的 额外 (不 必要 
的 ) 操作 的 数目 


3. 个 人 偏好 
同 任何 可 用 性 测试 一 样 ， 研 究 者 对 参与 者 做 了 面谈 以 收集 不 能 被 量化 的 信息 。 在 回答 完 
8 个 问题 后 ， 参 与 者 通过 回答 调查 问卷 上 的 一 系列 问题 来 表达 他 们 对 所 使 用 系统 的 感受 。 例 如 ， 
问题 “你 认为 问题 的 答案 容易 找到 吗 ? ”有 四 个 待 选项 :“ 很 容易 ”"、“ 容 易 ”"、“ 无 关 紧要 ”、 
“困难 ”"、“ 很 困难”。 
参与 者 认为 RSVP 的 操作 反应 速度 很 快 ( 每 秒 2 个 操作 ) 或 者 可 以 接受 ( 见 图 6-28) 。 和 识 
别 物体 所 需 的 100 毫 秒 下 限 ( 见 4.2 节 ) 相 比 ，500 毫 秒 的 显示 时 长 是 足够 的 同时 也 是 必需 的 ， 
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因为 用 户 需 要 时 间 进 行 解释 和 评估 ， 从 而 判断 某 个 新 闻 对 象 是 否 和 待 回 答 的 问题 相关 。 用 户 反 
馈 显 示 ，500 毫 秒 应 该 是 RSVP 浏 览 器 的 下 限 。 实 际 应 用 中 ， 最 好 让 用 户 自己 设 定 幻 灯 片 模式 


的 切换 速度 。 
19 


Ke g 满意 th ” 太 快 
图 6-28 参与 者 感知 到 的 RSVP 的 显示 速度 
调查 问卷 还 显示 ， 和 Pocket IE 相 比 ， 使 用 RSVP 浏 览 器 的 大 多 数 参与 者 感觉 自信 或 非常 自 


信 他 们 掌握 了 系统 的 所 有 功能 。 


6.3.7 讨论 


用 户 行为 度量 和 主观 评分 都 显示 ， 和 Pocket IE 相 比 ， 用 户 对 RSVP 浏 览 器 的 不 熟悉 在 初始 
时 使 得 该 系统 处 于 劣势 。 而 Pocket IE 的 交互 模式 更 接近 于 用 户 期 望 的 PDA 的 交互 模式 。 但 是 ， 
当 用 户 花 时 间 对 RSVP 浏 览 器 进行 体验 后 ， 无 论 在 此 过 程 中 有 无 外 界 帮 助 ， 该 系统 初始 时 的 劣 
势 消 失 了 ， 而 更 多 的 优势 得 到 了 体现 。RSVP 浏 览 器 将 故事 分 为 很 多 页 面 的 做 法 显著 地 降低 了 
在 文字 文件 中 滚动 所 需 的 认 知 成 本 。RSVP 浏 览 器 简单 的 交互 模式 保证 用 户 在 不 需要 大 量 训练 
的 前 提 下 就 可 以 自信 和 掌握 了 RSVP 浏 览 器 的 所 有 功能 。 


6.3.8 评论 


同 其 他 案例 分 析 一 样 ， 本 案例 强调 了 设计 受 很 多 因素 影响 这 一 事实 。 在 撰写 这 本 书 时 ， 业 
界 仍 然 对 PDA 或 手机 上 查看 网 页 这 一 任务 的 最 佳 实现 方法 存在 着 争论 。 但 本 案例 至 少 表明 了 
RSVP 浏 览 器 是 手持 设备 上 传统 的 网 页 浏览 器 的 可 行 的 替代 物 。 

考虑 到 RSVP 浏 览 器 的 实用 性 ， 还 有 很 多 技术 问题 需要 讨论 ， 如 服务 器 -客户 模式 以 及 网 
页 标准 等 。 对 此 感 兴趣 的 读者 可 以 参考 下 面 列 出 的 主要 参考 文献 。 
6.3.9 主要 参考 文献 

de Bruijn, O. and Tong, C.H. (2003) ‘M-RSVP: mobilé web browsing on a PDA’, in 


O'Neill, E., Palanque, P. and Johnson, P. (eds) People and Computers — 
Designing for Society, London, Springer, pp. 297-311. 


6.3.10 其 他 参考 文献 


Ayers, E. and Stasko, J. (1995) ‘Using graphic history in browsing the World 
Wide Web’, in Proceedings of the 4th International WWW Conference, 
December. 
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Cockburn, A., Greenberg, S., McKenzie, B., Smith, M. and Kaasten, S. (1999) 
‘WebView: a graphical aid for revisiting web pages’, in Proceedings OZCHI 
99, November. 

Kaasten, S., Greenberg, S. and Edwards, C. (2002) ‘How people recognise 
previously seen web pages from titles, URLs and thumbnails’, in ‘People and 
Computers XVI (eds Faulkner, X., Finlay, F. and Detienne, F.), Proceedings 
HCI 2002, London, Springer, pp. 247-265. 

Moyes, J. and Jordan, P.W. (1993) ‘Icon design and its effect on guessability, 
learnability and experienced user performance’, in Alty, J.L., Diaper, D. and 
Guest, D. (eds) People and Computers VIII, pp. 49-59. 

Tauscher, L. and Greenberg, S. (1997) ‘Revisitation: patterns in world wide web 
navigation’, ACM, Proceedings CHI ’97, pp. 399-406. 

Woodruff, A., Faulring, A., Rosenholtz, R., Morrison, J. and Pirolli, P. (2001) 
‘Using thumbnails to search the web’, ACM, Proceedings CHI 2002, pp. 


198-205. 
6.4 通信 分 析 
6.4.1 命令 和 控制 


通信 对 于 许多 活动 特别 是 对 分 布 式 安全 性 要 求 很 高 的 活动 中 的 命令 和 控制 (如 炮 战 、 执 法 
或 军事 行动 ) 而 言 是 非常 重要 的 。 在 这 些 环境 中 ,分布 于 不 同 地 点 的 多 个 小 组 要 在 危险 的 条 件 
下 达到 共同 目标 。 其 中 产生 的 消息 不 仅 对 取得 最 后 胜利 至 关 重要 ， 还 可 以 为 关键 人 物 的 表现 提 
供 观察 性 回溯 。 通 信 分 析 (communication analysis) 可 以 为 命令 控制 系统 的 重 设计 提供 宝贵 的 
信息 。 

为 了 方便 通信 分 析 ， 瑞 典 国防 部 研究 局 的 Morin 和 Albinsson 开 发 了 一 个 名 叫 MIND 的 系统 
用 于 支持 系统 开发 、 行 为 评估 和 训练 。 简 要 说 来 ，MIND 支 持 两 类 主要 活动 : 重建 
(reconstruction) 和 探索 (exploration)。 前 者 涉及 为 分 布 式 工作 会 话 建立 多 媒体 模型 ， 该 模型 
包括 声音 、 视 频 、 图 片 、 声 明 、 日 志文 件 以 及 运行 环境 中 的 多 源 位 置 数据 。 探 索 是 本 案例 支持 
的 第 二 类 主要 活动 ， 主 要 涉及 对 模型 中 数据 的 泻 染 和 探索 式 分 析 。 


6.4.2 系统 要 求 


这 样 的 系统 应 满足 哪些 要 求 ? 可 以 通过 它 回答 哪些 问题 ?可 以 确定 的 一 点 是 ， 必 须 保存 上 
下 文 数据 并 令 其 可 访问 : 对 系统 的 全 面 理解 不 仅 需要 关注 发 出 的 消息 ， 更 要 关注 消息 发 送 的 环 
境 。 我 们 在 第 4 章 中 已 经 讨论 过 ， 应 该 利用 上 下 文 数据 来 支持 分 析 者 在 大 量 数据 中 的 定位 。 信 
息 查询 过 程 中 的 一 个 主要 问题 是 查询 的 理解 和 构建 ， 因 此 查询 应 该 是 动态 的 。 这 对 于 问题 提出 
和 问题 解决 相互 关联 的 复杂 社会 技术 系统 是 非常 重要 的 。 然 而 ， 问 题 通常 是 不 能 预测 的 ， 因 此 
系统 需要 支持 灵活 的 分 析 。 针 对 “各 人 员 的 当前 位 置 "、“ 他 们 在 干什么 "、“ 给 他 们 分 配 了 哪 
些 任务 ”以 及 “通信 系统 的 当前 状态 ”等 问题 ， 回 答 必须 是 快速 的 。 对 数据 集 的 不 同 角度 的 快 
速 探 察 可 以 帮助 我 们 回答 问题 和 发 现 需要 探 察 的 问题 。 


6.4.3 MIND 工 具 


考虑 到 上 面 讨论 的 以 及 其 他 一 些 系统 需求 ， 针 对 紧急 救 授 和 军事 行动 中 指挥 官 控制 命令 的 
信息 识别 需求 ， 研 究 者 开发 了 上 下 文 相关 方法 和 探索 式 工具 。 对 于 本 书 而 言 最 有 趣 的 是 他 们 先 
择 了 第 3 章 中 介绍 的 属性 浏览 器 来 实现 复杂 敏感 的 通信 数据 的 分 析 。 下 面 的 实例 来 源 于 一 个 军 
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事 训 练 中 用 到 的 MIND 工 具 的 界面 。 


6.4.4 探索 式 分 析 


MIND 系 统 中 的 属性 浏览 器 有 助 于 对 通信 数据 记录 的 分 析 。 图 6-29 是 该 重要 部 件 的 简单 示 
意图 ， 其 中 只 显示 了 通信 数据 的 三 个 属性 。 该 系统 用 于 对 指挥 官 QJ 收 到 的 所 有 来 自 其 他 小 组 
的 通信 数据 以 及 持续 较 长 的 通信 序列 的 分 析 。 如 图 6-29 所 示 ， 发 起 者 中 有 三 个 小 组 被 选中 ，QJ 
是 被 选中 的 接收 者 ， 长 度 (时 长 ) 设 为 30 秒 到 2 分 钟 之 间 。 绿 色 元 素 说 明 RJ 和 SJ 是 通信 的 初始 
发 起 者 且 通 信 时 长 均 较 长 。 颜 色 传 递 了 额外 的 上 下 文 信息 。 例 如 ， 时 长 维度 上 选 定 区 间 外 的 黑 
色 元 素 表 明 QJ 确 实 收 到 过 一 些 较 短 和 较 长 的 消息 ， 但 没收 到 过 特别 长 的 消息 。 发 起 者 维度 上 
的 JC 等 灰色 元 素 代表 不 满足 筛选 条 件 的 元 素 ， 即 说 明 JC 从 未 向 QJ 发 起 过 通信 。 
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图 6-29 属性 浏览 器 在 通信 系统 中 的 应 用 示意 图 ( 见 彩 图 ) 


6.4.5 情景 


正如 前 面 提 到 的 ， 属 性 浏览 器 是 MIND 系 统 中 最 重要 的 部 件 。 它 的 优势 在 于 对 多 维度 数据 
的 多 种 表述 。MIND 系 统 的 另 一 个 重要 部 件 是 第 3 章 中 介绍 的 结 点 连接 图 。 我 们 将 通过 MIND 系 
统 在 军事 训练 中 的 应 用 来 展示 这 些 技术 的 应 用 以 及 属性 浏览 器 为 分 析 者 带 来 的 益处 。 

图 6-30 中 的 MIND 系 统 界面 展示 了 分 析 者 如 何 跟踪 某 个 小 组 在 某 个 特定 时 间 段 内 的 任务 执 
行情 况 。 在 时 间 维 度 上 将 时 间 段 设置 为 大 约 半 小 时 ， 发 送 者 限定 为 当前 感 兴趣 的 TJ， 接 收 者 设 
定 为 TJ 的 上 司 ， 信 息 类 别 设 定 为 “报告 "。 我 们 可 以 观察 TJ 如 何 发 送 定期 进度 报告 (时 间 维 度 
上 的 绿色 元 素 ) 。 相 关 报 告 的 信息 显示 在 MIND 系 统 的 左下 角 ， 以 便 分 析 者 回顾 、 重 现 原始 通 
信 ， 以 及 对 某 个 特定 通信 的 不 同 MIND 视 图 做 同步 。 界 面 还 提供 了 对 所 选 通信 的 发 生地 点 的 地 
图 视图 。 右 上 角 的 结 点 连接 图 显示 所 选 时 段 内 的 所 有 通信 记录 。 属 性 浏览 器 同样 提供 了 一 些 信 
息 。 例 如 ,在 接收 者 维度 上 的 设 定 范围 外 不 存在 黑色 元 素 , 说 明 TJ 只 向 (三 个 ) 上 司 做 过 报告 。 
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同样 的 ， 在 选 定 的 信息 类 别 外 没有 黑色 元 素 ， 说 明 TJ 只 在 该 时 段 内 发 送 过 报告 。 对 通信 时 长 维 
度 的 检查 发 现 除了 一 个 总 结 报告 通信 外 ， 其 他 所 有 通信 持续 时 间 都 较 短 。 
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64.6 Bit 


和 MIND 类 似 的 数据 记录 的 交互 式 显示 系统 (Albinsson et al., 2003) 实现 了 信息 识别 和 对 
指挥 者 的 需求 支持 。 分 析 者 不 仅 可 以 找到 问题 的 答案 ， 还 可 以 发 现 需要 回答 的 新 间 题 。 这 对 于 
问题 提出 和 问题 解决 相互 关联 的 复杂 社会 技术 系统 是 非常 重要 的 。 研 究 者 指出 ， 加 了 标注 的 数 
据 集 可 以 用 作 教 学 工具 。 

MIND 系 统 结构 是 很 有 用 的 ， 现 在 还 在 进一步 开发 中 。 未 来 的 发 展 方向 之 一 是 为 不 同 的 数 
据 视 图 建立 更 强大 的 联系 。 对 于 任何 的 改进 都 应 进行 评估 。 然 而 ，MIND 系 统 中 属性 浏览 器 的 
研发 者 指出 ， 将 该 系统 和 其 他 浏览 器 技术 进行 对 比 的 正式 评估 可 能 是 一 个 非 平凡 的 任务 并 且 设 
有 太 多 的 生态 相关 性 。“ 我 们 不 是 想 证 明 这 个 方法 是 理想 的 或 正确 的 ， 我 们 更 看 重 它 是 真实 的 ， 
实际 的 使 用 可 以 提供 更 多 的 启示 ”(Albinsson et al., 2003)。 


6.4.7 主要 参考 文献 


Albinsson, P-A., Morin, M. and Fransson, J. (2003) ‘Finding information needs in 
military command and control systems using exploratory tools for 
communication analysis’, Proceedings of the 47th Annual Meeting of the 
Human Factors and Ergonomics Society, Santa Monica, CA, The Human 
Factors and Ergonomics Society, pp. 1918-1922. 

Morin, M. and Albinsson, P-A. (2005) ‘Exploration and context in 
communication analysis’, in Bowers, C., Salas, E. and Jentsch, F. (eds) 
Creating High-Tech Teams: Practical Guidance on Work Performance and 
Technology, Washington, DC, APA Press, pp. 89-112. 
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6.5 文档 银河 
6.5.1 大 型 文件 集合 

用 户 经 常会 根据 精确 的 、 模 糊 的 或 者 是 不 能 表达 出 的 条 件 对 大 型 文件 集合 进行 探索 或 查询 。 
文档 类 型 多 种 多 样 ， 如 个 人 文献 集合 或 新 闻 组 织 为 记者 提供 的 档案 。 基 于 后 者 ， 位 于 奥地利 
Graz 的 Know-Center Graz、Hyperwave 和 Graz 理 工大 学 为 大 型 文档 库 设 计 了 一 个 名 为 InfoSky 的 
可 视 化 工具 。 

本 案例 分 析 的 目的 在 于 展示 信息 可 视 化 在 支持 大 型 文件 库 的 探索 和 查询 方面 的 作用 ， 以 及 
对 数据 进行 空间 管理 的 特殊 算法 的 价值 。 和 其 他 案例 分 析 一 样 ， 本 案例 体现 了 任务 本 质 对 可 视 
化 工具 设计 的 影响 。 


6.5.2 背景 各 需求 


InfoSky 使 用 了 和 该 工具 首 个 实例 系统 (Andrews et al., 2002) 相同 的 文档 库 。 库 中 包含 
109 000 篇 德语 新 闻 资 料 ， 它 们 被 手动 分 类 到 6900 个 类 别 及 子 类 别 中 ， 存 放 在 一 个 深度 为 15 层 


(220) 的 层次 结构 中 。 


InfoSky 需 要 满足 以 下 主要 需求 : 

。 可 扩展 性 : 系统 应 该 可 以 轻松 地 对 层次 结构 中 上 百 、 上 千 其 至 上 百 万 的 文件 进行 可 视 化 。 
。 层 次 + 相似 度 : 不 仅 要 展示 层次 结构 中 文件 间 的 关系 ， 还 应 显示 层次 结构 中 没有 直接 体 
现 的 单个 文件 间 的 相似 度 。 

。 焦 点 + 上 下 文 : 应 平滑 地 引入 信息 空间 的 全 局 和 局 部 视图 。 

。 稳 定性 : 一 个 稳定 的 隐喻 应 能 够 激发 视觉 回忆 和 特征 识别 。 即 使 局 部 层次 上 的 文件 结构 
发 生变 化 ， 数 据 编码 也 应 在 全 局 层次 上 保持 基本 不 变 。 

。 探 索 : 为 浏览 和 搜索 提供 的 交互 应 该 是 明确 易 懂 的 。 


6.5.3 早期 工作 


早 在 InfoSky 出 现 数 十 年 前 就 已 经 有 大 量 支 持 文件 库 探索 和 查询 的 创新 型 技术 出 现 。 虽 然 
它们 并 没有 实现 InfoSky 支 持 的 所 有 功能 ， 我 们 认为 还 是 应 该 首先 分 析 这 些 技术 的 主要 特点 。 

* BEAD (Chalmers, 1993) 一 一 根据 关键 字 对 文件 分 类 ， 这 些 类 别 显 示 在 一 个 2.5 维 场景 

中 ,标签 用 于 显示 不 同 的 类 别 ( 见 图 6-31)。 系 统 不 允许 手动 分 类 ， 原 始 数 据 无 组 织 ， 没 

有 使 用 任何 层次 结构 。 
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图 6-31 文件 库 的 风景 编码 ( 见 彩 图 ) 


° ZESPIRE (Wise et al., 1995) 系统 中 (图 6-32)， 在 高 维 语义 空间 中 的 “邻近 ”文件 被 自 
动 放 在 二 维 空间 中 的 邻近 位 置 。 海 拔高 度 表 示 相 似 度 。 文 件 库 无 组 织 ， 没 有 使 用 任何 层 
次 结构 。 
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图 6-32 关于 金融 行业 的 700 篇 文章 的 主题 编码 ( 见 彩 图 ) 


。 我 们 已 在 第 3 章 中 ( 见 图 3-95 或 本 节 中 的 图 6-33) 介绍 过 双 曲 线 浏 览 器 (Lamping and 
Rao, 1994) 。 它 实现 了 层次 系统 的 交互 式 编码 ， 人 允许 在 层次 结构 中 的 平滑 探索 和 直接 活 
动 。 变 形 技术 的 使 用 使 得 用 户 聚 焦 在 树 中 选 定 区 域 的 同时 还 能 保持 对 上 下 文 信息 的 认 知 。 
除了 先 验 层 次 组 织 ， 没 有 使 用 任何 内 容 、 关 键 字 或 文件 间 的 其 他 关系 。 虽 然 系统 没有 提 
供 搜索 功能 ， 但 是 该 功能 是 可 加 入 的 。 
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图 6-33 层次 组 织 的 文件 库 的 双 曲 线 编码 
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。 第 3 章 中 (图 6-34) 讨论 过 的 锥 形 树 (cone tree, Robertson et al., 1991) 紧凑 地 显示 了 一 
个 层次 系统 ， 但 是 不 能 聚焦 感 兴趣 区 域 。 除 了 层次 结构 ， 没 有 使 用 任何 内 容 、 关 键 字 或 
文件 间 的 其 他 关系 。 系 统 支持 交互 和 搜索 。 





图 6-34 侧 放 的 锥 形 图 保证 每 个 结 点 的 标签 可 读 。 可 以 加 入 变形 来 实现 聚焦 功能 


6.5.4 设计 决定 

根据 以 上 需求 ， 设 计 师 决 定 使 用 银河 系 的 隐喻 来 表示 文件 库 以 及 库 内 的 文件 ， 并 使 用 望 远 
镜 的 隐喻 通过 变量 放大 和 语义 缩放 来 实现 在 任何 细节 层次 上 的 探索 。 

图 6-35 显 示 了 银河 的 全 局 图 ， 其 中 每 个 星球 表示 一 个 文件 。 该 银河 系 的 数据 来 源 为 南 德 意 
志 报 (Suddeutsche Zeitung) 的 大 约 109 000 篇 德语 新 闻 资 料 。 该 报 编辑 根据 主题 将 这 些 文档 归 
类 到 大 约 6900 个 集合 中 ， 文 档 的 最 大 深度 达 15 层 。 





图 6-35 整个 银河 视图 ， 显 示 了 最 高 层次 上 各 集合 的 标题 以 及 集合 间 的 边界 
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图 6-35 中 显示 了 最 高 层次 上 主要 集合 的 标题 , 如 德国 各 联邦 州 (Bundeslander Deutschlands) 。 
对 应 的 子 集 显示 在 各 边界 内 。 层 次 结构 上 各 层 的 组 织 方 式 相 同 。 例 如 ， 图 6-36 中 的 “德国 各 联 
邦 州 ”被 选中 ， 对 应 的 子 集 被 放置 在 显示 区 域 中 央 ， 同 时 显示 各 子 集 的 标题 ， 如 拜仁 州 
(Bayern) 。 和 选择 拜仁 州 的 经 济 区 (Wirtschaftsraum Bayern) 令 该 子 集 得 到 高 显 (图 6-37) ， 选 
择 该 子 集 则 将 下 一 层 上 的 子 集 显示 在 中 心 位 置 (图 6-38)。 这 个 过 程 可 以 一 直 往 下 进行 直到 文 
件 名 得 以 显示 (图 6-39)。 








图 6-37 在 图 6-36 中 选择 拜仁 州 得 到 的 结果 。 鼠 标 悬 停 在 拜仁 州 的 经 济 区 
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图 6-38 选择 拜仁 州 的 经 济 区 得 到 的 结果 





图 6-39 文档 标题 在 最 底层 视图 可 见 


65.5 交互 和 查询 


银河 系 的 交互 很 简单 且 在 所 有 层次 上 保持 一 致 。 在 标签 上 单 击 鼠标 左 键 将 触发 到 下 一 层次 
的 语义 缩放 ， 单 击 鼠 标 右 键 实现 回 滴 。 按 下 鼠标 左 键 不 放 导 致 连 续 语义 缩放 以 帮助 用 户 迅速 到 
达 某 个 已 知 位 置 。 每 层 上 的 层次 结构 使 得 每 个 集合 保持 了 一 定 的 边界 形状 ， 从 而 易于 记忆 。 

用 户 可 以 进行 基于 关键 字 的 查询 ， 符 合 条 件 的 区 域 和 文档 都 将 得 到 黄色 高 显 (图 6-40)， 
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闪 动 的 文档 将 其 和 背景 区 域 区 分 开 来 ， 这 样 可 以 查看 查询 结果 所 处 的 上 下 文 信息 。 





图 6-40 符合 查询 条 件 的 区 域 和 文档 都 得 到 高 显 ( 见 彩 图 ) 


6.5.6 布局 


各 集合 的 边界 (图 6-41) 由 两 个 因素 决定 。 每 个 多 边 形 区 域 的 面积 和 内 部 文件 数目 成 正比 。 
每 个 区 域 的 中 心 位 置 受 子 集 内 文件 的 相似 度 影 响 。 


N-1EB 


SNE 





图 6-41 层次 结构 中 的 相 邻 两 层次 中 集合 的 关系 编码 ， 以 及 低层 次 上 各 集合 (A, B, CH) 及 其 
中 心 (C1, C2, C3) 


有 很 多 计算 文件 相似 度 和 决定 边界 的 算法 。 在 本 案例 分 析 中 ， 我 们 主要 想 提醒 读者 这 样 的 
算法 将 在 很 大 程度 上 影响 可 视 化 工具 的 质量 。 对 算法 细节 感 兴趣 的 读者 可 以 阅读 主要 参考 
文献 。 
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6.5.7 评估 
研究 者 将 InfoSky 和 传统 的 树 形 视 图 进行 了 比较 。 图 6-42 显 示 了 该 树 形 图 的 最 高 层次 。 


[C Deutschland(stars) | 

© (5 Kultur in Deutschland 

© CJ Bildungswesen in Deutschland 

œ Gi Bundesländer Deutschlands 

© C Innenpolitik Deutschlands 

> (4) Wirtschaftsraum Deutschland 

© (J Forschungsstandort Deutschland 

© cJ Justizwesen in Deutschland 

~ E Städte und Gemeinden in Deutschland 

o- (5 Soziales Leben in Deutschland 

© E Kriminalität in Deutschland 

> GJ Kirche und Religion in Deutschland 

> E AuBenpolitik Deutschlands 

> (J Alltagsleben in Deutschland 

© (5) Gesundheitswesen in Deutschland 

© ci Verteidigungswesen in Deutschland 

> E Sozialstruktur in Deutschland 

o- (5) Deutsche Geschichte 

© (J Natur und Umwelt in Deutschland 

o Ci Verkehrswesen in Deutschland 

© CJ Katastrophen und Unglücke in Deutschland 
© C3 Öffentliche Verwaltung in Deutschland 
> C3 Sport in Deutschland 

© C Statistik in Deutschland 

> C3 Grenzen Deutschlands 
| > C3 Landschaften in Deutschland 

~ C5 Deutsche Inseln 

> CH Seen und Flüsse in Deutschland 











图 6-42 传统 树 形 视图 的 最 高 层 


8 名 参与 者 被 随机 分 为 2 组 ， 每 组 人 员 被 要 求 分 别 利用 InfoSky 工 具 (望远镜 浏览 器 TS) 和 
树 形 视图 (TV) 来 完成 相同 的 2 组 各 5 个 任务 。 不 允许 同时 使 用 两 个 系统 ， 也 不 允许 使 用 查询 功 
能 。 在 每 组 人 员 中 ，2 名 先 使 用 TS 然后 使 用 TV， 另 外 2 名 反之 。 两 组 任务 集 尽量 保持 一 致 ， 以 
保证 解决 方案 实现 在 层次 结构 的 同一 层 上 ， 并 且 每 层 上 的 选项 数目 一 致 。 每 组 任务 的 执行 顺序 
在 参与 者 和 工具 之 间 平 均 分 布 。 实 验 开始 前 先 对 TS 系统 做 一 个 2 分 钟 的 简介 。 参 与 者 的 动作 由 
视频 记录 ， 任 务 完成 后 对 参与 者 做 了 调查 。 实 验 中 记录 下 了 找到 每 个 任务 解决 方案 所 耗 时 长 。 

在 所 有 80 个 解决 方案 (8 个 参与 者 ，2 组 各 5 个 任务 ) 中 ， 对 40 组 完成 时 间 的 比 对 发 现 ， 
TS 只 在 其 中 8 组 中 比较 快速 。 平 均 来 看 ，TV 比 TS 明显 快 得 多 (P<0.05) ，TS 比 TV 要 慢 36~~ 
186 秒 。 

研究 者 分 析 了 造成 TS 慢 速 的 两 个 主要 原因 。 首 先 ， 参 与 者 已 经 使 用 树 形 视图 很 长 时 间 了 ， 
对 树 形 视 图 的 隐喻 和 控制 方式 已 经 非常 熟悉 。 研 究 者 指出 ,“TS “两 分 钟 ” 的 训练 并 不 足以 弥 
补 这 个 注 沟 ”"。 其 次 ，TS 尚 处 于 初级 研发 阶段 ， 很 多 的 程序 缺陷 ， 例 如 很 小 的 多 边 形 和 “跳动 
的 标题 "， 都 影响 着 它 的 可 用 性 。 

我 们 不 应 该 仅 根 据 评估 结果 就 否定 银河 和 望远镜 隐喻 的 价值 。 第 一 ， 评 估 的 只 是 一 个 系统 
原型 。 第 二 ， 该 系统 涉及 用 户 不 熟悉 的 控制 方式 和 隐喻 。 第 三 ， 任 务 没有 测试 使 用 TS 找到 相 
似 或 相关 的 文件 或 子 集 的 功能 。 第 四 ， 没 有 向 参与 者 提供 查询 功能 。 第 五 ， 不 允许 同时 使 用 两 
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个 系统 。 鉴 于 以 上 这 些 限制 ， 评 估 结 果 算 不 上 是 消极 的 ， 银 河 + 望远镜 的 隐喻 能 够 最 终 成 为 支 
持 大 型 层次 文档 库 的 浏览 和 查询 的 好 方法 。 近 期 反馈 积极 的 实验 可 以 参考 Granitzer 等 和 Kappe 
等 的 参考 文献 ( 见 6.5.9 节 )。 


6.5.8 主要 参考 文献 


Andrews, K., Kienreich, W., Sabol, V., Becker, J., Droschl, G., Kappe, F., 
Granitzer, M., Auer, P. and Tochtermann, K. (2002) ‘The InfoSky visual 
explorer: exploiting hierarchical structure and document similarity’, 
Information Visualization, 1, 3/4, pp. 166-181. 


6.5.9 其 他 参考 文献 


Chalmers, M. (1993) ‘Using a landscape metaphor to represent a corpus of 
documents’, in ‘Spatial information theory — a theoretical basis for GIs’, 
Proceedings of the European Conference COSIT ’93, Springer-Verlag, 
Lecture Notes in Computer Science, pp. 377-388. 
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Lamping, J. and Rao, R. (1994) ‘Laying out and visualising large trees using a 
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Robertson, G.G., Mackinlay, J.D. and Card, S.K. (1991) ‘Cone trees: animated 
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Wise, J.A., Thoma, J.J., Pennock, K., Lantrip, D., Pottier, M., Schur, A. and Crow, 
V. (1995) ‘Visualising the non-visual: spatial analysis and interaction with 
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习题 


建议 通过 课堂 讨论 的 形式 来 加 深 对 以 下 习题 的 理解 。 
以 下 每 个 设计 习题 都 会 花费 每 个 小 组 (由 3 一 4 名 成 员 组 成 ) 5 个 完整 的 工作 日 。 其 目的 不 
在 于 测试 编程 能 力 ， 而 是 考虑 (定义 相对 松散 的 ) 任务 ， 决定 用 户 和 任务 的 本 质 ， 识 别 设计 因 
素 ， 做 出 主要 设计 决策 ， 然 后 对 其 进行 描述 。 这 个 过 程 将 涉及 连续 的 创造 性 设计 和 评估 。 我 们 
鼓励 使 用 头脑 风暴 (brain-storming) 和 中 间 (手绘 ) 草图 (最 好 像 在 真实 的 设计 所 里 一 样 保 
持 设计 的 连贯 性 )。 设 计 中 期 (大概 两 三 天 后 ) 要 求 进行 进度 汇报 。 最 终 成 果 要 求 总 结 为 不 超 
过 4 页 的 ACM 会 议 格式 的 报告 ， 报 告 中 不 允许 出 现 附录 、 图 片 或 印刷 品 。 这 些 习 题 强调 信息 可 
视 化 技术 的 使 用 ， 但 也 允许 使 用 其 他 技术 。 
6.1 花卉 展示 。 一 个 拥有 数 个 花艺 中 心 的 公司 在 考虑 是 否 要 让 顾客 通过 大 型 触摸 屏 来 查看 
该 公司 推出 的 花 霸 产品 。 大 多 数 顾客 对 植物 、 灌木 以 及 它们 的 最 佳 生长 环境 了 解 不 多 。 
该 公司 希望 看 到 一 个 或 多 个 这 样 的 界面 设计 方案 。 
62 有 哪些 有 趣 的 服务 ? 为 PDA 用 户 设计 一 个 显示 用 户 当前 位 置 范 围 内 的 本 地 服务 的 方 
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6.3 
6.4 


6.5 


6.6 


6.7 


6.8 


6.9 


法 。 假 设 PDA 上 有 GPS 设备 或 欧洲 卫星 导航 系统 。 

火车 旅行 。 选 择 一 个 大 型 火车 站 ， 为 其 设计 一 个 支持 旅行 信息 快速 查询 的 纸 质 海报 。 
找到 那 张 照 片 。 很 多 人 拥有 大 量 的 照片 ， 除 日 期 外 ， 很 少 有 人 对 照片 进行 其 他 标准 的 
分 类 。 要 想 找 到 一 张 照片 给 朋友 看 是 件 困难 的 事 。 设 计 一 个 支持 这 种 查询 的 界面 ， 显 
示 设 备 可 以 是 手机 、PDA 或 标准 显示 器 。 假 设 所 有 照片 可 以 按 日 期 和 地 点 (通过 GPS) 
自动 分 类 。 设 计 中 应 该 考虑 诸如 “ 那 是 去 年 夏天 在 意大利 ……” 的 活动 。 

期 刊 查询 。 对 于 生物 学 方面 的 一 个 研究 课题 ， 可 能 有 很 多 和 某 个 或 多 个 关键 字 相 关 的 
学 术 论文 。 可 以 根据 相关 性 在 查询 条 件 中 加 入 或 删除 这 些 关 键 字 。 设 计 一 个 支持 该 项 
查询 功能 的 界面 。 

本 科学 习 。 即 将 进入 大 学 学 习 的 学 生 通 常 要 访问 过 很 多 网 站 后 才能 决定 想 要 申请 的 学 
校 名 单 。 为 该 类 学 生 设计 一 个 网 站 。 

公交 车 旅行 。 在 伦敦 等 大 城市 中 ,公交 车 是 一 种 便利 的 交通 方式 。 回答 “该 乘 哪 路 车 ” 
特别 是 “该 转 乘 哪 路 车 ”等 问题 很 难 。 为 你 所 选 的 城市 伦敦、 纽约 、 巴 歼 均 可 ) ik 
计 一 张 公交 车 地 图 ， 要 求 它 能 帮助 人 们 找到 合适 的 路 线 。 最 好 用 一 个 小 的 虚拟 城市 来 
测试 你 的 初始 想法 ， 然 后 研究 如 何 对 其 进行 扩展 。 

在 线 购 物 。 一 家 家 具 店 〈 卖 桌子 、 椅 子 、 窗 、 书 柜 、 地 毯 和 灯饰 等 物品 ) 需要 一 个 支 
持 在 线 购 物 的 网 站 。 为 该 网 站 设计 界面 。 

手机 上 的 网 页 。 网 页 的 尺寸 相对 于 手机 显示 屏 而 言 是 很 大 的 。 但 手机 一 般 没 有 提供 触 
控 笔 等 直接 交互 设备 。 设 计 一 个 能 够 通过 手机 或 PDA 舒 适 地 进行 网 页 浏览 的 系统 。 


6.10 查看 电子 邮件 记录 。 很 多 电子 邮件 用 户 都 保存 有 长 期 以 来 的 邮件 收发 记录 。 首 先 列 


出 (大约 10 个 ) 用 户 对 该 记录 可 能 的 使 用 任务 和 可 能 提出 的 问题 。 然 后 ， 为 该 记录 
设计 一 个 交互 式 编 码 方案 ， 要 求 支持 所 有 前 面 提 到 的 以 及 设计 过 程 中 出 现 的 任务 和 
问题 。 


6.11 儿童 手机 。 考 虑 为 年 龄 在 3 一 5 岁 的 儿童 提供 手机 的 优势 和 劣势 ， 并 提供 相应 的 设计 。 


| 术 语 
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缩写 说 明 : 
Dict= 字 典 定义 
IV= 在 信息 可 视 化 领域 内 的 定义 


attribute (属性 ) 

Dict: 一 个 人 或 事物 所 具有 的 某 个 特性 或 特点 。 
attribute visibility, dimension visibility (属性 可 见 性 ， 维 度 可 见 性 ) 

IV; 使 对 象 在 每 个 属性 维度 上 的 属性 值 分 布 清晰 可 见 的 数据 描述 。 
breadcrumb trail (历史 信息 跟踪 ) 

IV: 对 离散 信息 空间 内 已 遍历 路 径 的 描述 (经 常 松散 地 表示 为 可 遍历 路 径 ) 。 
browse (浏览 ) 

Dict; [www.etymonline.com] 仔 细 观 察 。 

IV: 对 内 容 及 导航 线索 的 (通常 是 视觉 的 ) 感知 、 解 释 和 评估 的 活动 。 

在 对 静态 显示 和 序列 显示 的 仔细 观察 中 经 常 有 眼球 活动 。 

根据 意图 可 将 浏览 分 为 ， 随机 式 的 (内容 是 未 知 的) 、 探 察 式 的 (构建 空间 的 心理 模型 的 视 
图 ) 及 无 意 式 的 ( 非 直 接 的 )。 
brushing ( 扫 光 ) 

IV; 与 某 个 对 象 的 交互 导致 另 一 些 对 象 编码 的 实时 变化 。 
conceptual short-term memory (概念 型 短期 记忆 ) 

IV: 在 最 长 一 秒 的 时 间 内 对 刺激 做 出 反应 的 人 类 感觉 系统 模型 。 
derived value (推导 数值 ) 

IV: 从 已 有 值 中 推导 出 的 一 个 或 多 个 值 。 

示例 : 平均 值 、 方 差 。 
detail (细节 ) 

IV: 集合 中 某 个 对 象 的 一 系列 属性 信息 。 
dynamic query (动态 查询 ) 

IV: 对 一 个 或 多 个 数据 值 的 连续 手动 调整 引起 对 应 函数 值 的 视觉 描述 的 (例如 在 一 秒 之 内 ) 
实时 变化 的 界面 。 
exploration ( 探 察 ) 

IV: 为 部 分 或 整个 信息 空间 建立 心理 模型 而 采取 的 定位 和 浏览 活动 。 
fixation (凝视 ) 

Dict: 眼球 活动 停留 在 某 个 固定 点 。 
glyph (字形 ) 

IV: 为 传递 多 个 数据 值 而 设计 的 图 形 对 和 象 (Ware, 2004, p.145)。 
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insight (信息 启示 ) 

IV: 对 数据 的 内 部 模型 的 增强 (涉及 对 内 部 模型 的 增加 和 删除 ) ， 理 解 。 
navigation (定位 ) 

IV: 在 离散 或 连续 信息 空间 内 的 离散 移动 。 
object visibility (对 象 可 见 性 ) 

IV: 为 使 对 象 属性 清晰 可 见 而 将 对 象 视 为 独立 统一 的 视觉 单位 的 对 象 描述 。 
overview (总 图 ) 

IV: 对 对 象 集合 的 一 个 或 多 个 属性 的 评估 。 关 注 元 数据 或 范围 的 知识 获取 。 评 估 通 常 是 迅 
速 和 下 意识 的 。 它 既 可 以 是 有 意识 的 ， 也 可 以 是 无 意识 的 (下 意识 的 )。 
pre-attentive processing (下 意识 处 理 ) 

IV: 出 现在 有 意识 注意 之 前 的 感知 和 认 知 处 理 。 
presentation (表示 ) 

Dict; 提供 视图 ， 显 示 。 

IV: 对 已 编码 数据 及 其 显示 布局 的 选择 。 
pursuit (追踪 ) 

IV: 为 增强 朝向 某 个 目标 的 移动 所 采取 的 定位 行动 。 
relation (关系 ) 

Dict: 两 个 或 多 个 事物 间 的 逻辑 或 自然 联系 ;互相 之 间 的 相关 性 ， 联 系 。 
represent (描述 ) 

Dict: 描述 ， 描 绘 。 

Dict: 清晰 地 呈现 在 心中 。 

IV: 对 数据 的 视觉 、 声 觉 或 其 他 感知 形式 的 编码 。 
residue (残留 物 ) 

IV: 对 SM 编码 中 远 端 内 容 的 显示 。 
saccade ( 扫 视 ) 

Dict: 眼球 的 弹道 运动 。 
scent (气味 ) 

IV: 在 对 一 个 或 多 个 线索 解释 的 基础 上 感知 到 的 信息 空间 中 某 移动 的 益处 。 
search (查找 ) 

Dict: 为 了 找到 某 事物 而 做 的 检查 。 

查找 是 定向 的 且 具 有 某 个 特定 的 目标 。 在 信息 学 领域 该 术语 通常 意味 着 机 器 自 动 运行 的 查找 。 
如 果 查 找 由 人 来 执行 ， 则 可 能 涉及 一 种 或 多 种 浏览 和 定位 活动 。 
sensitivity (敏感 度 ) 

IV: 离散 信息 空间 中 的 活动 以 及 实施 活动 所 需 的 交互 。 
suppression (抑制 ) 

IV: 根据 某 些 自动 或 手动 选择 的 条 件 ， 去 除数 据 描述 中 的 菜 些 视图 。 
tree ( 树 ) 

IV: 由 结 点 和 连接 组 成 的 不 含 环 的 网 络 。 


A +173 


visualization tool (可 视 化 工具 ) 
IV: 软件 系统 ， 通 常 包含 允许 用 户 交 互 、 改 变 某 些 数 据 视图 以 及 形成 数据 的 心理 模型 的 视 
觉 显示 。 
visualize (可 视 化 ) 
IV: 对 某 事物 建立 心理 模型 。 
wayfinding ( 寻 路 ) 
IV: 探索 和 仔细 观察 的 结合 。 


关于 视频 | 


Information Visualization: Design for Interaction, 2E 


简短 的 视频 (例如 小 于 5 分 钟 ) 和 视频 剪辑 (10 ~30 秒 ) 可 以 为 信息 可 视 化 教学 提供 很 有 
效 的 帮助 。 

以 下 列 出 了 随 书 附 赠 的 DVD 上 的 所 有 37 个 免费 的 视频 和 视频 剪辑 。 对 于 每 段 视 频 ， 我 们 
列 出 了 其 在 本 书 中 的 对 应 章节 并 提供 了 有 关 的 期 刊 参考 文献 ， 随 后 给 出 了 它 的 格式 、 大 小 、 时 
长 、 背 景 信息 、 主 要 内 容 以 及 所 呈现 的 概念 。 

Vi 定性 描述 

V2 对 关系 的 动态 探索 

V3 声音 编码 : 脑 瘤 

V4 2020 年 的 可 视 化 

V5 属性 浏览 器 

V6 属性 浏览 器 ， 一段 演示 视频 

V7 Infocanvas 

V8 交互 式 韦 恩 图 

V9 锥 形 树 

VI0 基金 浏览 器 

V11 双 焦 显示 1 

V12 双 焦 显 示 2 

V13 手机 上 的 翻转 缩放 

V14 PDA 上 的 变形 地 图 

V15 可 折 桌 面 显示 技术 

V16 橡皮 地 图 变形 

V17 透视 墙 

V18 Sunburst 

V19 缩 放 和 平移 的 结合 

V20 悬浮 RSVP 

V21 图 片 浏览 -视频 可 索 求 

V22 小 显示 区 域内 的 定位 

V23 一 V28 图 片 表示 模式 

V29 咖啡 桌 上 的 随机 式 浏 览 

V30 基于 动态 描述 的 发 现 

V31 影 响 力 浏 览 器 

V32 Model Maker 

V33 自动 设计 的 人 为 指导 

V34 剂 析 和 矩阵 
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V35 Dust and Magnet 
V36 RSVP 浏 览 器 
V37 InfoSky 视 觉 浏览 器 


V1 定性 描述 
第 3 章 第 1 节 


Spence, R. and Drew, A. (1971) ‘Graphical exploration in electrical circuit design and 
modelling’, NRC, Ottawa, Proceedings 2nd Man-Computer Communications Seminar, pp. 61-70. 

QuickTime Movie，14.9MB，60 秒 (开始 无 声 ， 然 后 声音 响起 ) 

背景 

MINNIE 是 一 个 交互 图 式 的 计算 机 辅助 设计 系统 ， 主 要 用 于 数字 电路 辅助 设计 ，1968 年 开 
发 成 功 ，1985 年 成 为 商业 产品 。 该 视频 大 约 创建 于 1973 年 。 

动作 

加 的 大 小 表示 对 应 部 件 属性 的 改变 对 数字 电路 (本 例 中 指 它 的 放大 率 ) 的 某 些 属性 的 影响 。 
图 形 中 显示 的 频率 变化 在 bass 到 treble 之 间 的 频率 。 通 过 动画 显示 了 频率 从 bass 变 到 treble 过 程 
中 圆 的 大 小 变化 。 

呈现 

为 特别 是 定性 的 重要 启示 采用 了 面积 编码 ， 利 用 动画 来 处 理 额 外 的 维度 (在 本 例 中 指 
频率 ) 。 

注意 

设计 者 发 现 ， 当 电路 性 能 不 优 时 ， 这 样 的 敏感 度 信息 对 决定 修改 哪个 部 件 的 值 尤 其 有 用 。 
由 于 设计 师 对 每 个 部 件 的 效用 通常 可 能 有 一 些 预 设想 法 ， 这 些 先 验 值 和 实际 值 的 差异 (例如 预 
期 的 是 小 圆圈 ， 而 实际 得 到 的 是 大 圆圈 ) 可 以 起 到 良好 的 教育 作用 。 


V2 对 关系 的 动态 探索 
第 1 章 


Spence, R. and Apperley, M.D. (1974) ‘On the use of interactive graphics in circuit design’, 
IEEE, Proceedings of the International Symposium on Circuits and Systems, pp. 558-563. 

QuickTime Movie，3.5MB，38 秒 (无 声 ) 

背景 

在 工程 设计 领域 ， 在 产品 的 某 个 参数 值 必须 选 定 的 情况 下 ， 如 果 设 计 师 可 以 探索 产品 的 某 
些 属性 间 的 关系 ， 这 将 为 设计 带 来 很 多 益处 。 如 果 人 允许 设计 师 手 动 修改 参数 值 并 立即 看 到 参数 
值 的 修改 对 产品 性 能 的 影响 ， 将 增强 设计 师 对 关系 的 心理 模型 。 

动作 

本 视频 从 支持 数字 电路 设计 的 MINNIE CAD 系 统 的 影片 转换 而 来 ， 显 示 了 一 位 数字 电路 设 
计 师 通过 连续 改变 某 个 部 件 值 来 交互 式 地 探索 部 件 属 性 和 电路 整体 性 能 之 间 的 关系 。 

星 现 

即时 反映 ， 动 态 查询 。 
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V3 声音 编码 : Re 


感谢 MIT(Lowell，USA) 的 可 视 化 和 感知 研究 中 心 。 

第 3 章 第 1 节 

QuickTime Movie，15.8MB ，1 分 14 秒 

背景 

“可 视 化 ”一 词 通常 被 错误 地 理解 为 仅 利用 视觉 图 片 进 行 数据 描述 。 虽 然 视觉 描述 很 常见 ， 
但 也 可 以 使 用 数据 的 声学 编码 。 

动作 

该 视频 展示 了 在 脑 部 扫描 结果 的 探索 中 声学 编码 的 使 用 。 当 鼠标 在 头骨 和 肿瘤 这 两 个 不 同 
的 脑 部 区 域 移动 时 ， 完 全 不 同 的 声音 代表 了 不 同 的 信息 。 

呈现 

数据 的 声学 编码 。 


V4 2020 年 的 可 视 化 


BIB AG 

Spence, R. (1995) ‘Visions of design’, Journal of Engineering Design, 6,2, pp. 125-137. 

QuickTime Movie, 9.88MB, 45b 

背景 

在 1995 年 ，12 位 优秀 的 工程 设计 者 被 问 到 工程 设计 在 25 年 后 也 就 是 2020 年 的 发 展 状况 。 
视频 显示 的 是 优秀 的 工程 设计 师 在 2020 年 的 一 场 晚宴 中 对 他 们 设计 工作 的 描述 。 最 典型 的 想 
法 是 利用 大 型 显示 屏 、 协 作 工作 和 声音 编码 来 实现 数据 可 视 化 。 

动作 

三 位 工程 设计 师 在 工程 设计 中 同 数据 的 视觉 和 声 觉 编 码 进行 交互 。 

呈现 

协作 工作 ， 数 据 的 视觉 和 声 觉 编码 。 


V5 属性 浏览 器 
第 3 章 第 1 节 


Spence, R. and Tweedie, L. (1998) ‘The Attribute Explorer: information synthesis via 
exploration’, Interacting with Computers, 11, pp. 137-146. 

QuickTime Movie, 36.8MB, 3432p 

背景 

很 多 时 候 用 户 需要 根据 多 个 属性 值 从 很 多 对 象 中 选择 一 个 对 象 。 典 型 的 例子 有 购买 住房 、 
汽车 、 手 机 等 。 

动作 

对 于 所 有 对 象 ， 每 个 属性 都 表示 为 一 个 直方 图 ， 可 以 通过 选择 属性 范围 来 设置 限制 条 件 ， 
从 而 选择 落 在 该 限制 范围 内 的 对 象 。 当 探索 多 个 属性 时 ， 为 直方 图 之 间 建 立 联 系 ， 从 而 使 得 属 
性 选择 可 以 反映 在 其 他 直方 图 上 。 通过 交互 设置 属性 限制 条 件 , 用 户 可 以 建立 数据 的 心理 模型 ， 
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逐渐 将 被 选项 圈定 于 一 个 或 较 少 几 个 对 象 中 ， 然 后 可 以 对 它们 做 进一步 的 细节 探 察 。 

呈现 

直接 控制 的 动态 查询 ， 颜 色 编 码 的 敏感 度 信息 (特别 在 没有 符合 条 件 的 对 象 时 ) 对 用 户 的 
指导 ， 用 户 对 数据 不 熟悉 ， 所 以 通常 通过 探索 来 建立 心理 模型 ， 然 后 才能 确定 值得 进一步 探 罕 


的 对 象 。 
V6 属 性 浏览 器 : 一 段 演示 视频 
第 3 章 第 1 节 


Spence, R. and Tweedie, L. (1998) ‘The Attribute Explorer: information synthesis via 
exploration’, Interacting with Computers, 11, pp.137-146. 

QuickTime Movie, 72.2MB, 1935F (ZÆ) 

背景 

很 多 时 候 用户 需 要 根据 多 个 属性 值 从 很 多 对 象 中 选择 一 个 对 象 。 典 型 的 例子 有 购买 住房 、 
汽车 、 手 机 等 。 

动作 

该 (无 声 ) 视频 展示 了 属性 浏览 器 的 重要 特点 。 

呈现 

属性 浏览 器 的 重要 特点 ， 颜 色 编 码 的 敏感 度 信息 。 


V7 Infocanvas 


感谢 John Stasko, 
第 3 章 第 1 节 
Miller, T. and Stasko, J. (2001) ‘Information conveyance through personalised, expressive 
art’, ACM, Proceedings CHI’01, pp. 305-306. 
MPEG Movie, 70.8MB, 64>37# 
背景 
很 多 用 户 希 望 通过 简单 一 曾 就 能 得 到 信息 ， 如 交通 状况 、 天 气 、 股 票 、 突 发 新 闻 等 。 
动作 
不 同 于 传统 的 显示 器 ， 本 视频 提供 的 解决 方法 是 利用 悬挂 式 显示 屏 来 艺术 化 地 显示 用 户 感 
兴趣 信息 。 243 


对 经 常 出 现 但 很 少 访问 的 数据 进行 艺术 化 编码 。 
V8 交互 式 韦 恩 图 


感谢 Ron Bird 和 Ken Chahhawata, 

第 3 章 第 2 节 

QuickTime Movie，15.1MB，58 秒 (无 声 ) 

背景 

韦 恩 图 不 一 定 是 静态 的 : 交互 式 的 韦 恩 图 允许 用 户 灵活 地 对 数据 进行 查看 ， 因此 可 能 带 来 
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本 视频 展示 了 金融 领域 中 一 个 允许 和 表示 数据 描述 的 韦 恩 图 的 灵活 交互 的 系统 。 


呈现 
韦 思 图 ; 通过 动画 草图 向 客户 介绍 初始 设计 方案 。 


V9 锥 形 树 


感谢 Stu Card。 

第 3 章 第 2 节 、 第 5 章 第 6 节 

Robertson, G.G., Mackinlay, J.D. and Card, S.K. (1991) ‘Cone trees: animated 3D 
visualizations of hierarchical information’, ACM, Proceedings CHI ’95, pp. 189-194. 

QuickTime Movie, 10.5MB, ，1 分 5 种 

背景 

用 树 来 描述 层次 结构 的 数据 有 个 缺点 : 当 树 的 规模 很 大 时 ， 很 难 在 传统 显示 器 上 显示 整 棵 
树 。 锥 形 树 是 一 种 解决 方法 。 将 某 个 结 点 的 所 有 从 属 结 点 都 放 在 它 下 方 的 一 个 圆 中 ， 从 属 结 点 
和 该 结 点 间 的 连 线形 成 一 个 锥 形 。 这 样 一 个 三 维 布局 的 二 维 视图 叫做 锥 形 树 。 

动作 

当 需 要 查询 树 中 的 某 个 结 点 时 ， 所 有 和 该 结 点 相关 的 锥 形 被 放置 到 视图 前 部 。 当 选中 另 一 
个 结 点 时 ， 新 视图 并 不 是 立即 出 现 ， 而 是 通过 持续 一 秒 的 动画 来 实现 不 同 视 图 间 的 平滑 转换 ， 
从 而 帮助 用 户 维持 对 该 树 的 心理 模型 。 

呈现 - 

层次 结构 的 数据 描述 方法 ,利用 动画 帮助 在 视图 转换 中 维持 心理 模型 。 


V10 基金 浏览 器 


感谢 John Stasko。 

第 3 章 第 2 节 

Csallner, C., Handte, M., Lehmann, O. and Stasko, J. (2003) ‘FundExplorer: supporting the 
diversification of mutual fund portfolios using context treemaps’, IEEE, Proceedings of 
Information Visualization 2003, pp. 203-208. 

MPEG Movie, 87.8MB, 34>57# 

背景 

股份 共同 基金 是 股票 的 一 种 投资 方法 。 考 虑 到 两 个 不 同 的 基金 可 能 投资 同样 的 股票 ， 所 以 
经 常会 出 现 重 登 。 

动作 

本 视频 展示 了 建立 在 变形 树 图 基础 上 的 基金 浏览 器 ， 该 系统 允许 用 户 探索 投资 额 、 股票 的 

245) 上 下 文 信息 ， 以 及 投资 组 合 的 多 样 性 。 
呈现 
树 图 ， 交 互 式 探索 ， 上 下 文 。 
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V11 双 焦 显示 1 
第 4 章 第 1 节 


Spence, R. and Apperley, M.D. (1982) ‘Data base navigation: an office environment for the 
professional’, Bechaviour and Information Technology, 1, 1, pp. 43-54. 

QuickTime Movie, 2.78MB, 13#> 

背景 

发 明 于 1980 年 的 双 焦 显示 可 能 是 应 用 变形 技术 为 数字 信息 空间 提供 焦点 + 上 下 文 视图 的 第 
一 个 实例 。 用 户 可 以 在 聚焦 于 【例如 阅读 ) 一 个 或 两 个 文件 的 同时 看 到 整个 信息 空间 的 全 貌 。 

动作 

本 视频 ( 摄 于 1980 年 ) 展示 了 如 何 利用 滚动 将 感 兴趣 对 象 从 变形 区 域 带 入 焦点 区 域 。 

呈现 

焦点 + 上 下 文 ， 变形， 从 变形 区 域 到 焦点 区 域 的 平滑 切换 。 


V12 双 焦 显 示 2 


第 4 章 第 1 节 

Spence, R. and Apperley, M.D. (1982) ( 见 V11 双 焦 显 示 1) 
QuickTime Movie, 12.2MB, 60#> 

背景 

见 V11 ( 双 焦 显示 1)。 

动作 

该 视频 显示 了 画 在 纸 上 的 双 焦 显示 的 信息 空间 。 

呈现 

见 V11 ( 双 焦 显示 1)。 


V13 手机 上 的 翻转 缩放 


感谢 Ron Bird。 

第 4 章 第 1 节 

Holmquist, L. E. (1997) ‘Focus + Context visualization with flip-zooming and zoom 
browser’, Exhibit, CHI ’97. 

QuickTime Movie, 11.7MB, 1457% (无 声 ) 

背景 

对 于 焦点 + 上 下 文 问题 有 很 多 不 同 的 解决 方法 ， 其 中 很 多 都 使 用 了 变形 。 翻转 缩放 技术 最 
有 趣 的 特点 是 对 X 和 了 方向 均 做 了 同样 的 变形 ， 使 “变形 ” 区 域内 的 对 象 成 为 可 识别 的 缩 略图 ， 
当 对 象 是 未 变形 的 小 图 片 时 ， 这 样 的 方法 尤其 有 效 。 

动作 

本 视频 剪辑 展示 了 一 位 交互 设计 师 为 手机 制造 商 提供 的 产品 设计 动画 章 图 . 它 为 手机 用 户 
提供 了 一 种 图 片 浏览 方式 ， 该 方法 已 被 制造 商 采 用 。 
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呈现 
翻转 缩放 技术 ， 图 片 库 的 表示 ， 在 交互 设计 的 “提案 ”阶段 运用 动画 草图 。 


V14 PDA 上 的 变形 地 图 


感谢 IDELIX 软 件 有 限 公 司 的 David Baar, 

第 4 章 第 1 节 

参考 文献 和 V11 ( 双 焦 显示 1) 相同 。 

AVI，2.1MB，52 秒 (XE) 

背景 

结合 抑制 技术 的 双 焦 显示 技术 体现 了 焦点 + 上 下 文 的 概念 。IDELIX 已 将 该 方法 应 用 于 PDA 
上 波士顿 地 图 的 显示 。 

动作 

用 户 将 一 个 方 框 在 波士顿 (交通) 地 图 上 移动 ， 视 频 显 示 了 特定 部 分 如 何 被 放大 同时 被 填 
入 合适 的 数据 。 该 视频 显示 了 保持 普通 区 域 和 变形 区 域 之 间 的 连续 性 的 良好 效果 这 一 变形 技术 
的 重要 特点 。 

呈现 

变形 ， 连 续 性 ， 抑 制 。 


V15 可 折 桌 面 显 示 技术 


感谢 Chia Shen, 

第 4 章 第 1 节 

参考 文献 和 V11 ( 双 焦 显示 1) 相同 。V14 和 V16 为 相关 视频 。 

QuickTime Movie，15.9MB ，3 分 1 种 

背景 

见 V11 ( 双 焦 显示 1)。 

动作 

该 视频 显示 了 变形 技术 和 交互 式 桌面 的 有 效 结合 。 桌 面 上 方 的 投影 仪 在 桌面 上 投射 出 地 图 。 
用 户 把 手指 放 到 桌面 上 ， 可 以 通过 橡皮 变形 来 实现 地 图 的 变形 。 

呈现 

变形 ， 焦 点 + 上 下 文 ， 交互， 协作 。 


V16 橡皮 地 图 变形 


感谢 IDELIX 软 件 有 限 公司 的 David Baar, 

第 4 章 第 1 节 

参考 文献 和 V11 ( 双 焦 显示 1) 相同 。 

QuickTime Movie，5MB，33 秒 (无 声 ) 

背景 

结合 抑制 技术 的 双 焦 显示 技术 体现 了 焦点 + 上 下 文 的 概念 。IDELIX 已 将 该 方法 应 用 于 传统 
地 图 的 浏览 。 将 一 个 放大 区 域 移动 到 地 图 中 的 感 兴趣 区 域 ， 地 图 对 应 部 分 得 到 放大 ， 同 时 利用 
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变形 保持 上 下 文 。 

动作 

一 个 放大 区 域 在 传统 地 图 上 移动 ， 同 时 保持 完整 的 上 下 文 信息 和 连续 性 。 当 发 现 感 兴趣 区 
域 后 ， 该 区 域 周围 的 区 域 立 即 按 常 规 显 示 。 

呈现 

变形 ; 连续 性 ， 抑制 。 


V17 透视 墙 


第 4 章 第 1 节 

Mackinlay, J. D., Robertson, G.G. and Card, S.K. (1991) ‘Perspective Wall: detail and context 
smoothly integrated’, ACM, Proceedings CHI ’91, pp. 173-179. 

QuickTime, 11.3MB, 54#) 

背景 

见 V11 ( 双 焦 显示 1) 。 

动作 

该 视频 展示 了 透视 墙 的 三 维特 点 、 各 种 变形 方法 、 编 码 ， 以 及 将 感 兴趣 对 象 显 示 在 中 心 区 
域 的 动作 。 

呈现 

信息 空间 的 变形 。 


V18 Sunburst 


感谢 John Stasko, 

第 4 章 第 1 节 

Stasko, J. and Zhang, E. (2000) ‘Focus+context display and navigation techniques for 
enhancing radial, space-filling hierarchy visualizations’, IEEE, Proceedings of Information 
Visualization 2000, pp. 57-65. 

MPEG movie, 37.9MB, 3453#b 

背景 

层次 数据 的 放射 状 描述 有 个 很 大 的 问题 : 当 层次 增多 时 ， 外 围 很 多 对 象 将 变 成 难以 识别 的 
小 切片 。 

动作 

该 视频 展示 了 灵活 浏览 放射 状 描述 的 三 种 方法 : 允许 对 小 对 象 的 细节 查看 ， 同 时 显示 整个 
层次 的 上 下 文 信息 。 

呈现 

层次 数据 描述 ， 焦 点 + 上 下 文 技术 。 


V19 缩 放 和 平移 的 结合 


感谢 Andy Cockburn。 
第 4 章 第 1 节 
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Cockburn, A. and Savage, J. (2003) ‘Comparing speed-dependent automatic zooming with 
traditional scroll, pan and zoom methods’, in People & Computers XVII, pp. 87-102. 

MPEG movie, 30.8MB, 395% (无 声 ) 

背景 . 

透 过 电影 院 和 电视 等 应 用 ， 缩 放 和 平移 已 经 成 为 众所周知 的 技术 。 两 者 的 结合 ， 特 别 当 根 
据 平移 动作 的 本 质 实现 自 动 缩放 可 以 带 来 很 多 的 好 处 。 

动作 

该 短片 展示 了 平移 过 程 中 的 两 种 自动 缩放 技术 : 基于 速度 的 缩放 和 基于 置换 的 缩放 。 

呈现 

平移 过 程 中 的 自动 缩放 。 


V20 悬浮 RSVP 


感谢 Kent Wittenburg, 

第 4 章 第 2 节 

Wittenburg, K., Chiyoda, C., Heinrichs, M. and Lanning, T. (2000) ‘Browsing through rapid- 
fire imaging: requirements and industry initiatives’, SPIE, Proceedings of Electronic Imaging, pp. 
48-56. 

MPEG movie, 6.1MB, 30% (JCF) 

背景 

快速 序列 视觉 表示 (RSVP) 实现 对 图 片 库 的 快速 顺序 表示 证 实用 户 只 需要 100 毫 秒 的 查看 
时 间 就 能 识别 出 目标 图 片 。 

动作 i 

用 户 浏览 基于 悬浮 RSVP 显 示 技 术 的 商品 。 手 动 控制 允许 用 户 控制 对 所 有 对 象 的 前 后 翻动 ， 
以 及 发 现 感 兴趣 对 象 时 停止 显示 。 

呈现 

图 片 的 悬浮 RSVP 表 示 ， 当 用 户 目标 没有 精确 定义 时 ， 快 速 查看 可 以 带 来 好 处 。 


V21 图 片 浏览 -视频 可 索 求 
第 4 章 第 2 节 


Lam, K. and Spence, R. (1997) ‘Image browsing - a space-time trade-off’, Proceedings 
INTERACT ’97, pp. 611-612. 

Quicktime Movie, 21.4MB, 14>55# 

HR 

快速 翻动 书本 是 最 常见 也 最 有 效 的 快速 了 解 书本 大 致 内 容 的 方法 。 数 字 翻 动 是 支持 信息 空 
间 浏 览 的 有 效 方法 ， 该 方法 称 为 快速 序列 视觉 表示 (RSVP). 

动作 

该 视频 展示 了 RSVP 如 何 支 持 浏览 活动 以 及 如 何在 空间 和 时 间 之 间 取 得 平衡 ， 当 使 用 手机 
或 PDA 等 空间 受 限 设备 时 ， 这 种 平衡 显得 尤为 重要 。 
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呈现 
RSVP， 浏 览 活动 ，RSVP 固 有 的 空间 -时 间 平 衡 ， 基 于 RSVP 的 视频 点 播 系 统 。 


V22 小 显示 区 域内 的 定位 


第 4 章 第 2 节 

de Bruijn, O. and Spence, R. (2001) ‘Movement in the web’, extended abstracts, CHI 2001 
Companion Proceedings, pp. 209-210. 

Quicktime Movie, 34.1MB, 24>22% 

.背景 

在 手机 或 PDA 等 小 显示 屏 设 备 上 实现 庞大 信息 空间 内 定位 的 需求 日 趋 增长 。 

动作 

-种 解决 方法 是 利用 快速 序列 视觉 表示 (RSVP) 技术 所 提供 的 空间 -时 间 平 衡 。RSVP 既 

可 以 用 于 查看 外 部 链接 (如 在 图 片上 的 超 链接 )， 也 可 以 用 于 查看 “足迹 "， 即 信息 空间 中 已 访 
问 过 的 图 片 。 

呈现 

RSVP， 空 间 - 时 间 平 衡 ， 定 位 。 


V23~V28 图 片 表示 模式 


第 4 章 第 2 节 

Cooper, K., de Bruijn, O., Witkowski, M. and Spence, R. (2006) ‘A comparison of static and 
moving image presentation modes for image collections’, ACM, Proceedings AVI 2006, pp. 381-388. 

AVI movie， 每 个 视频 大 约 3MB BLK3~4%) (无 声 ) 

背景 

涉及 快速 顺序 图 片 表 示 的 快速 序列 视觉 表示 (RSVP) 有 很 多 不 同 的 模式 。 这 些 视频 展示 
了 包括 堆 模 式 (同时 显示 所 有 图 片 ) 在 内 的 一 些 显 示 模式 。 

动作 

一 组 很 短 的 6 段 视频 剪辑 展示 了 图 片 库 表示 模式 (3 种 “静态 ”模式 ，3 种 “动态 ”模式 ) ; 

e V23 幻灯 片 

*V24 HE 

*V25 混合 型 

. V26 对 角 线 


基于 快速 序列 视觉 表示 (RSVP) 的 图 片 表 示 技 术 。 


V29 咖啡 桌 上 的 随机 式 浏 览 
第 5 章 


Stathis, K., de Bruijn, O. and Macedo, S. (2002) ‘Living memory: agent-based information 
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management for econnected local communities’, Interacing with Computers, 14, 6, pp. 663-688. 

QuickTime Movie, 13.6MB, 143b 

背景 

随机 式 浏览 (OB) 是 一 种 重要 的 交互 模式 。 在 OB 模 式 中 ， 用 户 并 未 意识 到 他 们 对 眼球 暂 
时 聚焦 的 图 片 做 了 分 类 和 识别 以 判断 是 否 和 自己 的 兴趣 相关 。 

动作 

本 视频 展示 了 人 们 围 坐 在 咖啡 桌 旁 聊天 ， 桌 面 上 显示 了 新 闻 图 片 的 投影 ， 图 片 在 桌面 上 组 
慢 移动 ， 并 最 终 被 新 图 片 替换 。 当 人 们 注意 到 一 条 感 兴趣 的 新 闻 时 ， 可 以 用 手指 将 对 应 图 片 
“推动 ”到 桌面 中 央 位 置 ， 图 片 尺寸 增 大 ， 从 而 提供 更 多 细节 信息 。 

呈现 

随机 式 及 无 意 式 浏 览 。 


V30 基于 动态 描述 的 发 现 
第 5 章 第 2 节 


Spence, R. and Drew, A. (1971) ‘Graphical exploration in electrical circuit design and 
modelling’, NRC, Ottawa, Proceedings 2nd Man-Computer Communications Seminar, pp. 61-70. 
(as for V1 Qualitative Representation) 

QuickTime Movie, 4.77MB, 18b 

背景 

见 V1 定 性 描述 。 

动作 

见 V1 定 性 描述 。 

呈现 

展示 了 意料 之 外 的 发 现 如 何 出 现在 可 视 化 工具 中 。 两 个 突然 剧烈 放大 和 缩小 的 圆 表 示 电 路 
中 出 现 了 (通常 ) 不 该 出 现 的 效果 (共振 ， 和 Tacoma Narrows 大 桥 的 毁灭 性 共振 类 似 ) 。 随 后 
对 频率 显示 器 的 调节 展示 了 共振 发 生 时 的 频率 。 


V31 影响 力 浏览 器 
第 5 章 第 2 节 、 第 5 章 第 5 节 


Tweedie, L., Spence, R., Dawkes, H. and Su, H. (1996) ‘Externalising abstract mathematical 
models’, ACM, Proceedings CHI '96, pp. 406-412. 

Quicktime Movie, 47.8MB, 44}53#> 

背景 

工程 设计 师 要 为 多 个 参数 选择 合适 的 值 以 保证 系统 性 能 在 设 定 范围 内 。 影响 力 浏 览 器 中 应 
用 了 很 多 的 设计 (例如 ， 参 数值 的 选择 “覆盖 ”了 参数 空间 的 很 大 范围 ) ， 并 对 相应 的 性 能 做 
了 计算 。 影响 力 浏 览 器 可 视 化 工具 允许 像 属性 浏览 器 一 样 对 预 设 值 进行 查看 。 

动作 

本 视频 展示 了 台灯 灯丝 的 一 个 4 英寸 长 的 结构 。 4 个 参数 代表 了 该 结构 的 不 同 维度 ， 有 4 个 
性 能 参数 ， 分 别 代表 在 结构 的 不 同 点 的 压力 (Su er al.，1996)， 
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呈现 
探索 发 现 性 能 参数 间 的 平衡 ， 以 及 参数 和 性 能 间 的 相关 性 ， 将 性 能 限制 条 件 转换 为 满意 设 


计 在 参数 空间 内 的 位 置 ， 为 参数 选择 合理 范围 并 保证 高 性 能 。 
V32 Model Maker 


第 5 章 第 3 节 

Smith, A.J., Malik, Z., Nelder, J. and Spence, R. (2001) ‘A visual interface for model fitting,’ 
Quality and Reliability Engineering International, 17, pp. 85-91. 

Quicktime Movie, 47.5MB, 44 51#b 

背景 

在 科学 研究 .工程 设计 和 数据 控 据 中 经 常 需要 为 测量 或 模拟 数据 找到 一 个 适合 的 数学 关系 。 
对 于 不 熟悉 统计 学 的 用 户 来 说 这 是 一 项 困难 的 任务 。Model Maker“ 隐 藏 ”了 理论 和 算法 并 合 
理 利用 了 用 户 的 专业 知识 。 

动作 

数学 模型 (例如 多 项 式 ) 的 每 项 被 描述 为 一 个 方块 。 方 块 内 的 圆 的 大 小 代表 该 项 对 数据 良 
好 拟 合 的 重要 性 。 黑 色 圆 说 明 模 型 中 已 引入 该 项 ， 白 色 圆 说 明 该 项 尚未 引入 模型 。 

呈现 

面积 编码 (项 在 模型 中 的 值 ) ， 颜 色 编码 (表示 项 是 否 已 在 模型 内 ) ， 直 接 操控 (点 击 方 
块 ) 决定 是 否 将 项 加 入 模型 或 从 模型 中 删除 。 

注意 

本 界面 展示 了 所 有 可 能 的 独立 变化 对 已 有 模型 的 影响 ， 显 著 减 少 了 找到 模型 所 需 的 统计 
知识 。 


V33 自动 设计 的 人 为 指导 


第 5 章 第 4 节 

Colgan, L., Spence, R. and Rankin, P.R. (1995) ‘The cockpit metaphor’, Behaviour and 
Information Technology, 14, 4, pp. 251-263. 

QuickTime Movie, 79MB, 54740 

背景 

数字 电路 设计 中 的 “优化 算法 ”自动 反复 地 修改 电路 的 部 件 值 以 期 取得 较 好 的 电路 性 能 
但 是 ， 这 样 的 “自动 设计 ”存在 着 很 多 缺陷 : 例如 ， 设计 师 无 从 知道 最 终 电路 是 如 何 得 来 的 
(例如 ， 有 没有 遇 到 任何 的 平衡 操作 ? 如 果 某 个 参数 限制 条 件 逐 步 降低 ， 会 不 会 显著 提高 电路 
TERE? ) ， 因 此 很 难 定义 “ 较 好 性 能 ”标准 。 

如 果 优 化 过 程 是 可 控 的 或 可 以 根据 设计 师 的 专业 知识 进行 修改 ， 则 优化 算法 能 得 到 更 有 效 
的 应 用 。 结 合 优化 算 靶 和 设计 师 的 界面 叫做 cockpit。 

动作 

在 介绍 了 该 题目 和 很 多 设计 领域 的 相关 性 后 ， 该 视频 展示 了 如 何 提 高 芯片 电路 设计 性 能 。 

呈现 

自动 设计 的 人 为 指导 ， 面 积 和 颜色 编码 ， 实 际 可 视 化 工具 的 复杂 度 。 
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V34 剖析 矩阵 
第 5 章 第 5 节 


Tweedie, L. and Spence, R. (1998) ‘The prosection matrix: a tool to support the interactive 
exploration of statistical models and data’, Computational Statistics, 13, pp. 65-76. 

QuickTime Movie, 28.6MB, 24752#b 

背景 

和 影响 力 浏 览 器 类 似 ， 但 现在 通过 一 个 剖析 和 托 阵 对 预 设 数据 进行 检查 。 一 个 剖析 对 应 一 组 
参数 ， 通 过 颜色 编码 显示 在 该 二 维 空间 内 符合 其 他 参数 限制 条 件 的 满意 设计 的 位 置 。 该 空间 内 
的 黄色 矩形 代表 在 两 个 参数 值 允 许 范围 内 的 所 有 设计 。 要 想 取得 高 生产 效率 ， 黄 色 和 矩形 应 该 尽 
量 包 含 在 红色 〈 可 接受 的 ) 区 域内 。 


动作 
该 视频 对 剖析 和 矩阵 做 了 总 结 和 展示 。 
呈现 


通过 替换 为 简单 的 感知 任务 将 困难 的 认 知 问题 进行 简化 。 
V35 Dust and Magnet 


感谢 John Stasko, 

第 6 章 第 2 节 

Yi, J.S., Melton, R., Stasko, J. and Jacko, J.A. (2005) ‘Dust and magnet: multivariate 
information visualization using a magnet metaphor’, Information Visualization, 4, 4, pp. 239-256. 

Quicktime Movie, 46.6MB, 44)46#> 

背景 

很 难 用 普通 大 众 可 以 理解 的 方式 来 描述 高 维 数据 。dust and magnet 这 一 可 视 化 技术 使 用 
了 “magnet” 的 隐喻 和 适当 的 交互 技术 ， 使 得 用 户 可 以 根据 对 象 的 属性 值 灵 活 地 探查 可 能 的 
备 选 项 。 

动作 

该 视频 展示 了 dust and magnet 界 面 的 很 多 用 法 ， 包 括 用 户 实际 使 用 的 意料 之 外 的 策略 。 

呈现 

多 维 交互 描述 技术 ， 用 户 在 数据 探索 过 程 中 形成 问题 的 行为 。 


V36 RSVP 浏 览 器 


第 4 章 第 2 节 、 第 6 章 第 3 节 

DeBruijn, O. and Tong, C-H. (2003) ‘M-RSVP: mobile web browsing on a PDA” in O’Neill 
E., Palanque, P. and Johnson, P. (eds) People and Computers-Designing for Society, Springer, pp. 
297-311. 

相关 视频 见 V22 (小 显示 区 域内 的 定位 )。 

QuickTime Movie，2MB，6 秒 (无 声 ) 


> 
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背景 

在 小 屏幕 设备 如 手机 和 PDA 上 做 大 量 信息 (如 网 页 ) 定位 的 需求 日 趋 高 涨 。 

动作 

该 视频 展示 了 如 何 利 用 快速 序列 视觉 表示 (RSVP) 在 PDA 上 显示 新 闻 。 用 户 可 以 看 到 一 
系列 “预览 "， 每 个 预览 由 图 片 和 几 个 相关 词组 组 成 ， 因 此 新 闻 对 象 的 选择 是 实时 、 无 延迟 的 。 

呈现 

RSVP， 空间 -时 间 平 衡 。 


V37 InfoSky 视 觉 浏览 器 


感谢 Keith Andrews。 

第 6 章 第 5 节 

Andrews, K., Kienreich, W., Sabol, V., Becker, J., Droschl, G., Kappe, F., Granitzer, M., 
Auer, P. and Tochtermann, K. (2002) ‘The InfoSky visual explorer: exploiting hierarchical 
structure and document similarity’, Information Visualization, 1, 3/4, pp. 166-181. 

相关 视频 见 V22( 小 显示 区 域内 的 定位 ) 

AVI Movie, 25.2MB, 24734#b 

背景 

对 大 型 层次 数据 库 (如 大 型 新 闻 库 ) 的 结构 和 内 容 进行 可 视 化 是 个 很 具 挑 战 性 的 课题 。 

动作 | 

该 视频 展示 利用 InfoSky 视 觉 浏览 器 对 含有 100 000 篇 新 闻 文 章 的 层次 数据 库 进 行 探索 和 查 
找 。 该 系统 使 用 了 “银河 和 望远镜 ”的 隐喻 。 文 章 在 空间 内 的 位 置 反映 了 它们 之 间 的 相似 度 ， 
这 也 从 另 一 方面 增强 了 探索 和 查找 功能 。 

呈现 

银河 和 望远镜 的 隐喻 ， 语义 缩放 ， 根 据 相 似 度 对 对 象 做 算法 定位 。 
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Bryson, B., 3 
Buja, A., 176 


索 引 * 199 


Burke, M., 153 
Cairns, P., 19, 117 
calendars {日 历 ) 
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Card, S.K., 105, 160, 178, 188, 244, 249 
cartoon faces (卡通 脸 ), 66-67 
case studies (案例 分 析 ), 185-233 
‘archival galaxies’ (档案 银河 ), 220-230 
“communication analysis’ (通信 分 析 ), 216-220 
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网 页 浏览 ), 206-216 
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相关 性 ， 见 属性 相关 性 ) 
dimension visibility (维度 可 见 性 ), 70, 234 
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Eskicioglu, R., 49 
expanding image/target (图 像 / 对 象 扩展 ), 128-129 
exploration (探索 ), 24-25, 151, 235 
exploratory analysis, by Attribute Explorer (基于 属 
性 浏览 器 的 探索 性 分 析 ), 217-218 
exploratory browsing (探索 式 浏览 ), 141, 168, 169, 
235 
eye-gaze behaviour ( 腿 球 话 动 行为 ), 125-126, 168 
investigation of (调查 ), 126 
see also fixations; saccades ( 见 凝视 ， 扫 视 ) 
EZChooser visualization tool (EZChooser 可 视 化 工 
AL), 18n, 25, 35, 155, 156, 167, 168 
bargrams in EZChooser (EZChooser 中 的 条 形 图 )， 
18-25, 197, 199, 200 
case study (案例 分 析 ), 197-206 
existing solutions (已 有 方法 ), 198-199 
problem (问题 ), 197 
task (任务 ), 197-198 
compared with other query systems (和 其 他 查询 系 
统 的 比较 ),203-205 
data exploration in EZChooser (EZChooser 中 的 数 
据 探索 ), 200-201, 203 
evaluation of EZChooser (EZChooser 的 评估 ), 205 
sensitivity (敏感 度 ), 202 


Farrand, W.A., 116 

Fawcett, C., 127 

Feiner, S.K., 59 

Field, G.E., 166 

Film Finder interface (电影 查询 界面 ), 61 

filtering (过 滤 ), 23, 155 

FishCal calendar (FishCal 日 历 ), 187-196 
background (背景 ), 188-189 
calendar views (日 历 视图 ), 190-191 
compared with Pocket PC calendar (和 Pocket PC 

日 历 的 比较 ), 192-196 
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design philosophy (设计 哲学 ), 187-188 
interactive control (交互 控制 ), 191-192 
search facility (查找 功能 ), 192 
usability study (可 用 性 研究 ), 193-196 
fisheye lens concept ( 鱼 眼 透镜 概念 ), 117, 187 
fixations (凝视 ), 125-126, 235 
fleeting images (转瞬 即 逝 的 图 像 ), 123 
flip-zoom technique (翻转 一 缩放 技术 ), 108, 109 
video illustrating (演示 视频 ), 247 
Flipper visual search system (Flipper 视 觉 查找 系 
统 ), 121 
floating RSVP mode of image presentation (图 像 描 
述 的 悬浮 RSVP 模 式 ), 121, 122, 128 
video illustrating (演示 视频 ), 251 
Fliut, C., 82, 83 
focus+context problem (焦点 + 上 下 文 问题 ), 103 
historical note (历史 评论 ), 116-117 
focus+context techniques (焦点 + 上 下 文 技 术 ), 103- 
116 
videos illustrating (演示 视频 ), 246, 248, 250, 159 
focusing (3% #4), 22 
foraging theory (搜索 理论 ), 160 
forensic investigations (法 庭 调查 ), 74-75 
formulation of problem (问题 形成 ), 17 
foveal angle (in eye) ( (IRER) 视网膜 中 央 思 点 )， 
126, 146 
Fowlkes,E.B., 144 
fraud investigations (欺诈 调查 ), 11, 72-73 
Freeman, L.C., 77, 78, 78-79 
Friendly, M., 6n, 65, 66 
FundExplorer, video illustrating (基金 浏览 器 ， 演 
示 视 频 ), 245-246 
Furnas, G.E., 176 
Furnas, G.W., 109, 117, 151, 156, 188, 189 


galaxy metaphor (for document archive) ( (文件 档 

案 的 ) 银河 隐喻 ), 223 
Video illustrating (演示 视频 ), 260 

Garland, K., 77 

GENSTAT package (GENSTAT 43), 161 

geographical maps (地 理 地 图 ), 101-103, 1/0, 113- 
114 

geological samples (地 质 采 样 ), 66-67 


geometric zoom (几何 缩放 ), 117, 118-119 
compared with semantic zoom (和 语义 缩放 相 比 

较 ), 119 

geovisualization (地 理 可 视 化 ), 12, 13 

Gibson, J.J., 152&n 

glossary (术语 ), 234-237 

glyph(s) (字形 ), 69, 235 

domain-specific (基于 应 用 的 字形 ), 199, 202 

‘go and see' approach (“ 先 走 后 看 ”方法 )，155， 
168, 186 

Goodman, T.G., 140 

Google Earth (谷歌 地 球 ), 118 

Granitzer, M., 229 

Greenberg, S., 163, 212 

Grimes, J., 179 

Grimshaw, C., 100 

gross national product (GNP) data (国民 生产 总 值 
(GNP) 数据 ), 178, 179 

Guides technique (Guides 技 术 ), 198 

Ghuimbretiere, F., 121 


halo (combined distortion/suppression) technique 
(halo (结合 变形 /抑制 ) 技术 ), 116 

Handte, M., 245 

Heinrichs, M., 251 

help fields (帮助 字段 ), 158-159 

Herot, C.F., 40, 119 

hierarchical data presentation, videos illustrating (B 
次 数据 表示 ， 演 示 视 频 ), 250 

hierarchically ordered objects, hyperbolic browser 
representation (层次 排序 的 对 象 ， 双 曲线 浏览 
器 描述 ), 90, 97, 222 

hierarchically structured menu-based systems (基于 
菜单 的 层次 结构 的 系统 ), 157-159 

high-resolution graphic displays (高 分 辨 率 图 形 显 
示 ), 6-7 

higher-order cognitive processes (高 阶 认 知 过 程 ), 27 

histograms (直方 图 ), 35, 36 

linked (关联 直方 图 ), 37-38, 41, 61-65 

HIVE, 88 

Hochheiser, H., 37 

Hodges, W., 72 

Holmquist, L.E., 109, 247 


Hook, K., 156 
hotels (旅馆 ), 81-82, 82-83 
house purchasing (住房 购买 ), 37-39, 37, 41, 44-45, 
56, 57, 61-64, 68, 81, 137-138, 153-155, 198 
‘how do I get there?’ (“ 我 怎样 到 达 那 里 ? ” ), 
150, 151 
human user (人 类 用 户 ), 10-11 
human visual performance, models of (人 类 视觉 行 
为 ， 人 类 视觉 行为 模式 ), 129-130 
hyperbolic browser ( 双 曲 线 浏 览 器 ), 89-91, 222, 
223 
hypervariate data ( 超 变量 数据 ) 
representation of (H838), 56-70 
in applications (应 用 ), 186, 197-206 


i2, 74 
iconic encoding (图 标 编码 ), 56, 66-69 
icons (图 标 ), 66-69 
IDELIX Software Inc. (IDELIX 软件 有 限 公司 )， 
109, 110, 248, 249 
image presentation (图 像 表示 ) 
collage RSVP mode ( 拼 贴 图 ), RSVP 模 式 121， 
122, 128 
diagonal/"time tunnel’ (moving) mode (对 角 线 / 
“时 间 隧 道 ”( 活 动 ) 模式 ), 124, 125 
video illustrating (演示 视频 ), 253 
floating RSVP mode (悬浮 RSVP 模 式 ), 121, 122, 
128 
video illustrating (演示 视频 ), 121, 122, 128 
manual control of (手动 控制 的 图 像 表 示 ), 128- 
129 
mixed (static) mode (混合 型 (A) 模式 ), 124 
video illustrating (演示 视频 ), 253 
rate of presentation (表示 速度 ), 120, 123 
relative advantages (相对 优势 ), 126-128 
ring (moving) mode (环形 (运动 ) 模式 ), 124, 
125 
video illustrating (演示 视频 ), 253 
slide-show mode (幻灯 片 模式 ), 120, 124, 186 
videos illustrating (演示 视频 ), 253 
stream (moving) mode (W (运动 ) 模式 ), 124， 
125 : 
video illustrating (演示 视频 ), 253 
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tile mode ( 堆 模 式 ), 120, 124, 208, 209 
video illustrating (演示 视频 ), 253 
see also rapid serial visual presentation ( 见 快速 
序列 视觉 表示 ) 
Imperial College Television Studio (伦敦 帝国 理工 
学 院 电 视 工 作 室 ), 103 
inattentional blindness( 非 注意 盲 视 ), 10, 179 
Influence Explorer, video illustrating (影响 力 浏览 
器 ， 演 示 视 频 ), 255 
InfoCanvas, video illustrating (InfoCanvas ， 演 示 视 
频 ), 243-244 
InfoCrystal, 81-82 
information space(s) (信息 空间 ) 
continuous (连续 信息 空间 ), 139 
discrete (离散 信息 空间 ), 137, 139, 140 
movement/navigation in (信息 空间 内 的 活动 / 定 
位 ), 25-26 
type (信息 空间 类 别 ), 139-140 
information visualization, means of term (信息 可 视 
ft, RR), 12 
InfoSky visual explorer (InfoSky 视 觉 浏 览 器 ), 220 
background (背景 ), 220 
compared with Tree Viewer (和 树 浏览 器 比较 ), 
228-229 
design decisions (设计 决定 ), 223-224 
earlier work (早期 工作 ), 221-223 
evaluation of (评估 ), 228-229 
interaction (交互 ), 224 
layout (布局 ), 227-228 
requirements (要 求 ), 221 
search facility (查找 功能 ), 224-227 
video on (视频 ), 260 
InfoZoom query system (InfoZoom# if) A), 205 
Inselberg, A., 9, 56, 59 
insight (启示 ), 5, 16, 62, 64, 136, 235 
Institute for Visualization and Perception Research 
(视觉 和 感知 研究 所 ), 241 
intelligence analysis (智能 分 析 ), 74 
intention of user (用 户 意 图 ), 141-142 
interaction (交互 ), 14, 24, 25, 26, 136-184 
composite mode (混合 模式 ), 141, 173-177 
continuous mode (连续 模式 ), 140, 144-149 
framework (框架 ), 142-144 
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see also Norman's Action Cycle ( 见 Norman 动 作 
周期 ) 
modes (模式 ), 140-141 
passive mode (被 动 模式 ), 140-141, 167-172 
scenarios (情景 ), 136-139 
stepped mode (渐进 式 模式 ), 137, 140, 149-167 
video illustrating (演示 视频 ), 259 
interaction design (交互 设计 ), 180-182 
case studies (案例 分 析 ), 185-233 
complexity (复杂 度 ), 182 
palettes for ( 调 色 板 ), 91, 92, 130, 137, 180, 18] 
interaction dynamics (交互 动态 性 ), 177 
interactive attribute selection (交互 式 属性 选择 )， 
21-22 
interactive bargrams, applications (交互 式 条 形 图 ， 
应 用 ), 18-19, 21-22, 186 
interactive histograms (交互 式 直方 图 ), 56, 64 
interactive movement in information space (信息 空 
间 内 的 交互 移动 ), 25-26 
see also navigation ( 见 定位 ) 
interactive object selection (交互 式 对 象 选 择 ), 18- 
l 19 
interactive rearrangement (交互 式 重 排 ), 17 
interactive table (交互 式 表 格 ), 109, 110 
video illustrating (演示 视频 ), 248 
internal model (内 部 模型 ), 10 
interpretation (解释 ), 27 
Intraub, H., 130 
investment portfolio (投资 组 合 ), 56 
video illustrating (演示 视频 ), 245-246 
involuntary browsing (无 意 浏 览 ), 141, 168, 235 
Norman’s Action Cycle for (Norman 动 作 周 期 )， 
172 
iPhoto, 121, 128 
Irani, P.P., 49 
“is it here?”(“ 它 在 这 里 吗 ? ” ), 120 
item vector (对 象 向 量 ), 199 


Johnson, B., 85 
Jones, S., 163 
Jordan, P.W., 213 
Jul, S., 151 


Kaasten, S., 163, 208 

Kadmon, N., 115 

Kappe, F., 229 

Keim, D.A.,9 

Keyhole, Web browsing through (HAR, 4 F BAR 
的 网 页 浏览 ), 206-216 

Kirsch, D., 199 

Komlodi, A., 121 

Krebs, J.R., 160 


Lalanne, D., 169 
Lam, K., 121,252 
Lamping, J., 89, 223 
landscape representation (风景 描述 ), 221 
Lanning, T., 203, 251 
law enforcement applications (法 律 强制 执行 应 用 )， 
11, 74-75 
LCD display coffee table ( 带 LCD 显示 屏 的 咖啡 
桌 ), 138-139 
leaf node (叶子 结 点 )，84 
Lehmann, O., 245 
Leung, Y.K., 105, 106 
Levy, E.I., 123, 129 
Lewis, D., 151 
Lewis, M., 102 
Li, Q., 64 
Library of Congress, representation by hyperbolic 
browser ( 双 曲 线 浏 览 器 表示 的 美国 国会 图 书 
馆 ), 91, 222 
limit positioning tool (限制 条 件 定位 工具 ), 154 
Lindner, H.-G., 205 
lines {线条 ) 
relations represented by (线条 表示 关系 ), 72-79 
width (宽度 ), 1, 29 
link previews (in Web browser), sequential 
Presentation of ( (网 页 浏览 器 ) 关联 预览 ， 
顺序 表示 ), 208, 209 
linked histograms (关联 直方 图 ), 37-38, 41, 61-65 
‘live stream’ display (“实时 流 ” 显 示 ), 169, 170 
Living Memory coffee table (实时 记忆 咖啡 桌 ), 138 
video illustrating (演示 视频 ), 254 


location breadcrumb trails (位 置 历史 信息 跟踪 )， 
165-166 


logical association (逻辑 关系 ), 71, 79, 81 
London Underground map (伦敦 地 铁 地 图 ), 3-5, 29, 
30, 54-55, 75-77 
distorted presentation of (变形 表示 ), 106, 170 


Ma, K.-L. 69, 70, 149 
MacOSX system (MacOSX 操作 系统 ), 109, 170, 
128 
MacEachren, A.M., 13n 
Macedo, S., 254 
McGill, R., 52, 54, 55 
McGuffin, M., 109, 129 
Mackinlay, J., 51, 52, 54-56, 109, 189, 244, 249 
magic lens (魔术 透镜 ), 113-114 
magnification encoding (放大 编码 ), 42, 43 
Malik, Z., 256 
Malone, T.W., 97 
maps (地 图 ), 1-2, 3-5, 29, 30, 54-55 
geographical (地 理 地 图 ), 101-103, 7/0, 113-114 
see also cluster maps; tree maps ( 见 族群 图 ， 树 
图 ) 
Marchionini, G., 121 
median values (中 值 ),34 
mental models (心理 模型 ), 10, 18, 145, 177-178 
visual momentum for (#9 th), 180 
metaphorical icons (隐喻 式 图 标 ), 66-69 
Microsoft Internet Explorer, pocket version (微软 IE 
浏览 器 ， 手 持 版 本 ), 213-215 
military exercise, communication analysis (军事 训 
练 ， 通 信 分 析 ), 217-219 
Miller, T., 69, 243 
Minard’s map (Minard 地 图 ), 1-2, 29, 54, 55, 136- 
137, 139-140 
MIND system (MIND 系 统 ), 217-220 
components {部 件 ), 218-219 
exploratory analysis in (探索 式 分 析 ), 217-218 
MINNIE CAD system, videos illustrating (MINNIE 
CAD 系 统 ， 演 示 视 频 ), 239-240 
Mitta, D.A., 113 
mixed mode of image presentation (混合 型 图 像 表 
示 模 式 ), 124 
video illustrating (演示 视频 ), 253 
mobile phone (手机 ) 


Rx 引 * 205 


presentation of photographs on (照片 表示 ), 108, 
109 
representation of attributes {属性 描述 ), 49, 50 
Web browsing on (网 页 浏览 ), 121, 206-216 
Model Maker interface (Model Maker 界面 ), 161, 
162 
video illustrating (演示 视频 ), 256 
Moller, T., 13 
Moreno, J.L., 77 
Morin, M., 65, 217 
Morris, C.J., 68 
mortgage fraud (抵押 诈骗 ), 11, 72-73, 74 
mosaic plots (马赛 克 图 标 ), 65-66, 67 
mouse-over actions (鼠标 悬 停 动 作 ). 22, 83, 144, 
145 
moving displays (活动 显示 ), 169-172 
Moyes, J., 213 
multidimensional icons (多 维 图 标 ), 68, 69 
MultiNav query system (MultiNav 查 询 系 统 ), 203- 
204 
usability issues (可 用 性 问题 ), 204-205 
multiple attributes (多 属性 ), 20 
multiple ‘pop-outs’ (多 “醒目 ”), 49, 50 
multivariate data (多 变量 数据 ) 
representation of ( 撕 述 ), 56-70 
videos illustrating (演示 视频 ), 258 
Munro, A.J., 156 


Napoleon’s march to/from Moscow [map] (拿破仑 
东 征 莫斯科 及 撤退 [地 图 ]), 1-2 
naval operations (海事 行动 ), 119 
navigation (定位 ), 24-25, 25-26, 150-151, 235 
social (社会 定位 ), 156 
videos illustrating (演示 视频 ), 252-253, 259-260 
navigational aids, RSVP Browser (定位 帮助 ， 
RSVP 浏 览 器 ),211, 212 
navigational cues (定位 线索 ), 151, 152, 153, 167, 
207-208 
navigational guidance (定位 指导 ), 24-25, 167 
proportion of screen area devoted to (分 配给 定位 
的 屏幕 区 域 比 例 ), 167 
Neighbourhood Explorer (邻居 浏览 器 ), 204, 205 
Nelder, J., 256 
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networks (网 络 ), 84 

‘New Yorker’s View of the World’ (“从 纽约 人 的 
视角 看 世界 ”), 109, 111 

news item selection (新 对 象 选择 ), 207 

newspaper articles collection, exploration and 
searching of (新 闻 报 道 库 及 其 探索 与 查找 )， 
220, 223-228 

Newton, C.M., 144 

Nielsen, J. 153, 162, 167 

Nightingale, Florence, 2, 29 : 

node-link diagrams ( 结 点 连接 图 表 ), 72-79, 218, 219 

non-quantitative data, encoding of ( 非 量 化 数据 及 其 
编码 ), 54-56 

Norman, D.A., 140n, 142, 152&n 

Norman, K.L., 158 

Norman’ Action Cycle (Norman 行 动 周期 ), 142-144 

action-execution step (动作 执行 步骤 ), 143, 144- 


145 
action-plan-formulation step (动作 计划 形成 步 
OR), 143, 144 


applications, in continuous interaction (在 连续 式 
交互 中 的 应 用 ), 144-147 
‘change in world/view’ (“世界 /视图 变换 ”)， 
177 
evaluation step (评估 步骤 ), 143, 146 
Gulf of Evaluation (评估 海湾 ), 142, 143-144 
Gulf of Execution ($447 #878), 142-143 
intention-formulation step (意图 形成 步骤 )，142- 
143, 144° 
interpretation step (解释 步骤 ), 143, 145-146 
North, C., 64 
numbers, collection of (数字 ， 数 字 集 合 ), 34-35 
numerical data (数值 型 数据 ), 5 


object (对 象 ), 17 

object correlation (对 象 相关 性 ), 70, 147 

object visibility (对 象 可 见 性 ), 59, 66, 69, 236 

Oldfield, T., 774 

online buying (在 线 购物 ), 121, 204 

Opportunistic browsing (随机 式 浏 览 ), 141, 168, 235 
video illustrating (演示 视频 ), 254 

optimization algorithms (优化 算法 ), 170, 171, 257 
monitoring progress of (过 程 监控 ), 170-171 


video illustrating (演示 视频 ), 256-257 

ordinal data (类 别 型 数据 ),5,35 
encoding of (编码 ), 54-56 
representation of (描述 ), 36 

organization tree (组 织 树 ), 111 

Ort, Sheldon, 12 

Ovenden, M., 75 

overview (总 图 ), 18, 19, 236 

overview+detail (总 图 + 细节 ), 99-103 


page-flipping/riffling analogy (#4 #241), 120, 121, 
252 
palettes, interaction designer ( 调 色 板 ， 交 互 设 计 
师 ),91, 92, 130, 137, 180, 181 
panning (平移 ), 117 
combined with zooming ( 同 缩放 结合 ), 117-118 
video illustrating (演示 视频 ), 250-251 
Parallel bargrams (平行 条 形 图 ), 20-23, 25, 199, 200 
parallel coordinate plots (平行 坐标 图 ), 56-59, 70 
parameters (参数 ), 173 
performance influenced by (性 能 影响 ), 173-177 
Parr, M., 68 
passive interaction (被 动 式 交互 ), 140-141, 167-172 
path breadcrumb trails (路 径 历 史 信息 跟踪 ), 163- 
164, 165 
first example ( 首 个 例子 ), 166 
perception (感知 ), 27, 31 
performance (性 能 ), 173 
effect of parameters (参数 效应 ), 173-177 
personal digital assistants (PDAs) (个 人 数字 助手 
(PDA) ) 
browsing of photographs (照片 浏览 ), 109 
calendars (日 历 ), 107, 108, 187-196 
control buttons used in RSVP Browser (RSVP 浏 
览 器 中 的 控制 按钮 ), 212 
maps (地 图 ), 709 
video illustrating (演示 视频 ), 247-248 
Web browsing on (网 页 浏览 ), 206-216 
perspective wall (透视 图 ), 109, 170 
video illustrating (演示 视频 ), 249-250 
perusal see browsing ( 细 读 ， 见 浏览 ) 


pharmaceutical industry applications (制药 业 应 用 )， 
7,8,12 


Pirolli, P., 160 
Plaisant, C., 189 
pliable display (interactive table) (可 折 显 示 屏 (4 
互 式 桌面 ) ), 109, 170 
video illustrating (演示 视频 ), 248 
Pocket IE, compared with RSVP Browser (Pocket 
IE 和 RSVP 浏 览 器 的 比较 ), 213-215 
Pocket PC calendar, compared with FishCal 
calendar (Pocket PC 日 历 和 FishCal 日 历 的 比 
较 ), 193 
pocket PCs (便携 式 PC) 
web browsers for (网 页 浏览 器 ),213-216 
see also personal digital assistants (PDAs) ( 见 个 
人 数字 助手 (PDA) ) 
‘pop-outs’( “REA” ), 46,47-51,56 
animation of (动画 ), 50-51, 147-149 
dynamically triggered (动态 触发 的 ), 50-51, 147- 
149 
multiple (多 个 ), 49, 50 
population densities, representation of {人口 密度 及 
其 描述 ), 42, 43 
Potter, M., 130, 168, 172 
Potter, M.C., 123, 129, 130 
pre-attentive processing (下 意识 处 理 ), 47-51, 236 
present, definition (表示 及 其 定义 ), 98, 236 
presentation of data (数据 表示 ), 14, 17-18, 22, 23, 
24, 25, 97-135 
presentation time (表示 时 间 ), 123 
product failure (产品 失效 ), 46 
prosection (剖析 ), 176-177 
prosection matrix (#] 473k), 176, 177 
video illustrating (演示 视频 ), 257-258 
protein representation (蛋白 质 描述 ), 105, 114 
Pu, P., 169 
pursuit GEBR), 151, 236 


qualitative representation, video illustrating (定性 描 
述 ， 演 示 视 频 ), 239-240 
quantitative data (量化 数据 ), 5 
encoded, accuracy of judgment (编码 ， 判定 精 
RE), 54,55 
encoding of (编码 ), 54-56 
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Rankin, P.R., 256 
Rao, R., 89, 105, 168, 188, 223 
rapid serial visual presentation (RSVP) (快速 序列 视 
觉 表 示 (RSVP) ), 120-123 
collage RSVP (拼接 图 RSVP), 121, 122, 128 
floating RSVP (悬浮 RSVP), 121, 122, 128 
video illustrating (演示 视频 ), 251 
rate of image representation in (图 像 表 示 速 度 )， 
123 
slide-show mode (幻灯 片 模式 ), 120, 124, 208, 
209 
video illustrating (演示 视频 ), 253 
tile mode ( 堆 模 式 ); 120, 124 
videos illustrating (演示 视频 ), 253 
use in Web browser (网 页 浏览 器 应 用 ), 208-215 
videos illustrating (演示 视频 ),251-253, 259-260 
see also image presentation; RSVP Browser ( 见 
图 像 表 示 ; RSVP WH) 
Raymond, J.E., 126n, 130 
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rearrangement of presentation of data (数据 表示 的 
重 排 ), 8, 17 
recommender-generated sensitivity (推荐 产生 的 敏 
感度 ), 156 
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for case studies (案例 分 析 ), 196, 206, 216, 220, 
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video illustrating (演示 视频 ), 253 
Robertson, G.G., 85, 177, 187, 244, 249 
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link preview mode (链接 预览 模式 ), 209, 271 
navigational aids (定位 帮助 ), 211,212 
page mode (页 模式 ), 209, 277 
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video illustrating (演示 视频 ), 259-260 
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115 
video illustrating (演示 视频 ), 249 
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视 ), 179 
safety-critical activities, command and control of 
(对 安全 性 要 求 很 高 的 活动 中 的 命令 和 控制 )， 
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感度 的 关系 ), 160 
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semantic zoom (语义 缩放 ), 40, 42, 119, 223, 224 
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较 ), 119 

video illustrating (演示 视频 ), 260 
semi-qualitative representation ( 半 定 性 描述 ), 18 
sensitivity (敏感 度 ), 24, 151-156, 237 

relation to residue and scent (和 残留 物 及 气味 的 
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sensitivity information (敏感 度 信息 ), 24, 153-154 
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videos illustrating (演示 视频 ), 239-240, 243 
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Shlomi, E., 115 
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Siirtola, H., 58,59, 69 
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design (设计 ), 56 

manufacture (制造 ), 11 
Simon, H., 6, 29 


Simons, D.J., 10, 179 

single number, representation of (单个 数值 及 其 摘 
述 ), 31-34 

size encoding (大 小 编码 ), 9, 46, 47, 51, 56, 147 

videos illustrating (演示 视频 ), 256-257 

size representation in qualitative understanding ( 定 
性 理解 的 面积 描述 ), 41-42, 43 

‘slice-and-dice’ construction of tree map ( 树 图 的 
“切片 和 盘子 ”建立 法 ), 86-87 

slide-show mode of image presentation (图 像 描 述 的 
幻灯 片 模式 ), 120, 124, 186 

video illustrating (演示 视频 ), 253 

SM encoding (SM 编码 ), 152, 153, 154, 156, 202 

Smartmoney.com website (Smartmoney.com 网 站 )， 
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Smith, A.J., 161, 256 

Smith, D., 42, 43 

Snow, Dr John (John Snow 医 生 ),3, 29 

Snowberry, K., 157, 158, 166 

social navigation (社交 定位 ), 156 

social network analysis (社交 网 络 分 析 ), 77-78, 77- 
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Sion, R.S., 177 
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encoding of data by (数据 的 声音 编码 ), 34 
videos illustrating (演示 视频 ), 241-242 
space limitations (空间 局 限 性 ), 22-23, 98-120 
space-scale diagrams (空间 刻度 图 表 ), 117-118 
space-time trade-off (空间 和 了 时间 的 平衡 ), 121 
videos illustrating (演示 视频 ), 252-253, 259-260 
Spatial Data Management System (SDMS) (空间 数 
据 管理 系统 (SDMS) ), 119 
Spence, R. 
case studies (案例 分 析 ), 188, 197, 198, 204 
on interaction (交互 ), 139, 140, 147, 155, 173, 
176, 177 
on presentation (表示 ), 103, 107, 120, 121 
on representation (描述 ), 9, 39, 61, 68 
videos (视频 ), 239, 240, 241, 242, 243, 246, 252, 
253, 254, 255, 256, 257 
spiral calendar (螺旋 形 日 历 ), 190 
SPIRE document exploration/searching tool 


(SPIRE 文 件 探 索 / 查 找 工 具 ), 221, 222 
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Spoerri, A., 81 
Spotfire visualization too! (Spotfire 可 视 化 工具 ), 7, 
8, 154, 186 
star plots ( 星 形 图 ), 59-60, 69 
Stasko, J., 69, 109, 207, 243, 245, 250, 258 
State of the World Atlas, 42, 43 
Stathis, K., 138, 254 
static displays (静态 显示 ), 137, 167-168 
Stephens, D.W., 160 
stepped interaction (WHER X A), 137, 147, 149-167 
in discrete information spaces (离散 空间 内 的 渐 
进 式 交互 ), 149-150 
Stock, D., 67 
Stone, M., 114 
stream (moving) mode of image presentation (图 像 
表示 的 流 (运动 ) 模式 ), 124, 125 
video illustrating (演示 视频 ), 253 
structural stresses (结构 压力 ), 147, 148 
video illustrating (演示 视频 ), 255 
structure (结构 ), 30 
Su, H., 147n, 255 
Sun, L., 121 
suppression of data in presentation (数据 表示 中 的 
抑制 ), 22, 23, 109, 111-114, 237 
applications (应 用 ), 113-114, 186, 188, 190 
videos illustrating (演示 视频 ), 247-248, 249 
surgical operation, representation of data (外 科 手 
术 ， 数 据 描述 ), 34 
Sutherland, I.E., 144 
Sutton, J., 188 
Swedish Defence Research Agency (瑞典 国防 研究 
局 ), 64, 217 


table lens (表格 透镜 ), 105, 106, 188-189 
table presentation (表格 表示 ), 17 
Tables technique (Tables 技 术 ), 198 
tagging (标记 ), 21, 201 
Tahir, M., 153, 167 
task (任务 ), 16 
Tauscher, L., 163, 212 
‘tectonic’ calendar (“建筑 ”日 历 ), 188, 190 
Telescope browser (望远镜 浏览 器 ) 
compared with Tree Viewer (和 树 浏 览 器 比较 )， 
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see also InfoSky visualization tool (W, InfoSky 7] 
视 化 工具 ) 
Teoh, S.T., 69, 70, 149 
themescape representation (themescape 描 述 ), 222 
three-dimensional (3D) representation (三 维 (3D) 
HAIR), 42, 44-46 
thumbnails ( 缩 略 图 ), 207-208 
tile mode of image presentation {图 像 表 示 的 堆 模 
式 ), 120, 124 
video illustrating (演示 视频 ), 253 
TileBars interface ( 平 铺 条 形 图 界面 ), 53-54 56 
time limitations (有 时间 局 限 ), 120-130 
time series, representation of (时 间 序 列 及 其 描述 )， 
37, 38 
‘time tunnel’ (moving) mode of image presentation 
{图片 表示 的 “时 间 隧 道 ”( 活 动 ) 模式 ), 124, 
125 
timeline style chart (时 间 线 风格 图 表 ), 75 
Titanic disaster (泰坦 尼克 号 事件 ), 65-66, 67 
Tong, C.H., 121, 208, 259 
Tory, M., 13 
tree ( 树 ), 84, 237 
see also cone tree ( 见 锥 形 树 ) 
tree maps ( 树 图 ), 85-89 
advantage (优点 ), 87 
applications (应 用 ), 87-88 
disadvantages (缺点 ), 86, 87 
video illustrating (演示 视频 ), 245-246 
tree representations ( 树 的 描述 ), 83-84 
Tree Viewer ( 树 视 图 ), 228 
compared with Telescope browser (和 望远镜 浏览 
器 比较 ), 229 
trivariate data, representation of (三 变量 数据 及 其 
描述 ), 42-56 
Tse, T., 121 
Tufte, E.R., Z, 3, 6n, 34 
Turkey box plot (Turkey 箱 形 图 ), 34, 35 
TV purchasing (购买 电视 ), 203-204 
Tweedie, L., 39, 61, 173, 176, 198, 242, 243, 255, 
257 
Tweedie, L.A., 30, 140 


univariate data, representation of ( 单 变 量 数据 及 其 
描述 ),31-36 
usability studies (可 用 性 研究 ), 182 
PDA calendar (PDA H f), 193-196 


value (数值 ), 30 
encoding of (编码 ), 31-70 
bivariate data ( 双 变 量 数据 ), 36-42 
hypervariate data ( 超 变 量 数 据 ), 56-70 
trivariate data (三 变量 数据 ), 42-56 
univariate data ( 单 变量 数据 ), 31-36 
Varakin, D.A., 179 
Venn diagrams ( 韦 思 图 ), 79-80 
videos illustrating (演示 视频 ), 244 
video editing (视频 编辑 ), 100 
video-on-demand (视频 点 播 ), 121, 122 
video illustrating (演示 视频 ), 252 
videos (视频 ), 238-260 
Attribute Explorer (属性 浏览 器 ), 242-243 
bifocal displays ( 双 焦 电视 ), 246-247 
combined zoom and pan (缩放 和 平移 的 结合 )， 
250-251 
cone tree ( 锥 形 树 ), 244-245 
discovery via dynamic representation (基于 动态 
描述 的 发 现 ), 254-255 
distorted map on PDA (PDA 上 的 变形 地 图 ), 247- 
248 
dust and magnet, 258 
dynamic exploration of relationships (关系 的 动 
态 探索 ), 240-241 
encoding by sound-brain tumour (声音 编码 脑 
瘤 ), 241 
flip-zoom on mobile (手机 上 的 翻转 缩放 ), 247 
floating RSVP (悬浮 RSVP), 251 
FundExplorer (基金 浏览 器 ), 245-246 
human guidance of automated design (自动 设计 
的 人 为 指导 ), 256-257 
image browsing (图 片 浏览 ), 252 
image presentation modes (图 片 表示 模式 ), 253 
Influence Explorer (影响 力 浏览 器 ), 255 
InfoCanvas, 243-244 
InfoSky visual explorer (InfoSky 视 觉 浏览 器 )， 
260 


interactive Venn diagram (交互 式 韦 思 图 ), 244 
Model Maker, 256 


navigation via small display (小 显示 区 域内 的 定 


位 ), 252-253 
opportunistic browsing with coffee table (MES 
上 的 随机 式 浏览 ), 254 
perspective wall (透视 图 ), 249-250 
pliable display technology on table (可 折 桌 面 显 
示 技 术 ), 248 
prosection matrix (剖析 矩阵 ), 257-258 
qualitative representation (定性 描述 ), 239-240 
RSVP Browser (RSVP 浏 览 器 ), 259-260 
rubber sheet map distortion (橡皮 地 图 变形 ), 249 
sunburst, 250 
visualization 2020AD (2020 年 的 可 视 化 ), 241-242 
visibility (可 见 性 ), 59 
see also attribute visibility; object visibility ( 见 属 
性 可 见 性 ， 对 象 可 见 性 ) 
visual interaction see passive interaction (视觉 交 
互 ， 见 被 动 式 交 互 ) 
visual momentum (视觉 冲 量 ), 180 
visual perception (视觉 感知 ), 27 
visualization (可 视 化 ) 
definition (定义 ), 5-6 
early examples (早期 实例 ), 1-5 
taxonomy (术语 ), 12-13 
visualization tool(s) (可 视 化 工具 ), 8, 12, 25, 35, 237 
Visualize, meaning of term (可 视 化 及 其 术语 ), 237 
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Watson, C.J., 67 
Watson, M., 34 
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wayfinding ( 寻 路 ), 151, 237 
Web browsing (网 页 浏览 ) 
revisitations ( 重 访 ), 163 
selective retreat (选择 性 回 退 ), 163, 166, 167 
through keyhole [case study] (基于 锁 眼 的 网 页 浏 
览 [案例 分 析 ]), 206-216 
problem (问题 ), 207-208 
solution (解决 方法 ), 208 
task (任务 ), 206 
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see also RSVP Browser ( 见 RSVP 浏 览 器 ) 
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154 
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‘what’s there?’ (“那里 有 什么 ?”), 141 
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哪里 去 ”), 150, 151, 160, 212 
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151, 163 
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Wildbur, P., 153 
Williamson, C., 144, 154 
Wise, J.A., 221 
Witkowski, M., 253 
Wittenburg, K., 18n, 25, 35, 121, 125, 150, 155, 
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览 ), 206-216 
as information space (如 同 信息 空间 ), 139 
interaction modes (交互 模式 ), 140 
revisitations ( 重 访 ), 163 
Wright, H., 169 


X-distortion (X 方 向 上 的 变形 ), 105-106, 107, 188 


Y-distortion (7 方向 上 的 变形 ), 106, 107, 188 
Yi, J.S., 199, 258 
‘you are here’ sign (“ 你 的 当前 位 置 ”标识 ), 101 


Zhang, E., 109, 250 

zooming (缩放 ), 117, 118-120 
combined with panning (和 平移 相 结合 ), 117-118 
video illustrating (演示 视频 ), 250-251 

geometric (几何 缩放 ), 117, 118-119 

semantic (语义 缩放 ), 40, 42, 119, 223, 224 
video illustrating (演示 视频 ), 260 
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